Inserire newline (\n) con innerHTML in pre elemento in IE non funziona?

Mi trovo di fronte al seguente problema: ho un documento HTML in cui si desidera stampare base di stato/debug/etc messaggi.

Così, il documento HTML contiene un vuoto pre-elemento il cui id è fuori:

<body onload='init () && main();'>

<pre id='out'>
</pre>

</body>
</html>

La funzione init() assegna il pre elemento di una variabile:

  var out_div;

  function init() {
      out_div = document.getElementById('out')
      return 1;
  }

Poi, in ordine di stampare qualcosa nel pre-div, io uso questa funzione:

  function txt_out(txt) {
      out_div.innerHTML += "\n" + txt
  }

Il newline necessario assicurarsi che ogni invocazione di txt_out è scritto sulla propria riga.
Questo funziona come previsto in Firefox. CIOÈ, tuttavia, non sembra prestare attenzione alla \n. Quindi, questo è sbagliato su IE, o sto facendo qualcosa di sbagliato?

solo <br/>il nara si
Sì, è sbagliato su IE. IE strisce leader gli spazi quando l’impostazione innerHTML: bytes.inso.cc/wp/2009/11/07/… le Biblioteche possono aiutare ad alleviare questo (jQuery so fa con .html() metodo).
Quando in dubbio, CIOÈ è sbagliato.

InformationsquelleAutor René Nyffenegger | 2009-11-25

4 Replies
  1. 3

    Fare le cose come element.innerHtml += something; è di solito una cattiva pratica, perché rende il browser ri-analizzare l’intero contenuto dell’elemento. Come aggiungere più dati, ogni volta diventa sempre più lento. E ‘ invalida anche qualsiasi riferimento/ascoltatori che altri pezzi di codice potrebbe avere sulla sua sub-elementi.

    Meglio utilizzare un div tag; qualcosa di simile:

    <div id='out'></div>

    e poi aggiungere i nuovi sub-elementi al volo:

    out_div = document.getElementById('out');
    
    //add a new message
    new_element = document.createElement('div');
    new_element.textContent = "your message here";
    new_element.className = "some_class"; //CSS class for changing the appearance
    out_div.appendChild(new_element);
    Oops! Fisso errori di JavaScript nella mia risposta.

    InformationsquelleAutor intgr

Lascia un commento