jQuery text () - Aufruf bewahrt Zeilenumbrüche in Firefox aber nicht in IE

Mache ich:

alert($("#div").text());

auf so etwas wie dieses:

<div id="div">
&lt;div&gt;
Some text
&lt;div&gt;
</div>

Warum das ausgetretene Inhalt? Da ist es manchmal fehlerhaften und ich will ihn nicht zu stören oder zu brechen den rest des Dokuments.

FF es zeigt sich die Erhaltung Zeilenumbrüche. In IE7 es nicht. Ich brauche, um die Erhaltung der weißen Raum. Dieser Inhalt ist eigentlich Los in eine textarea zum Bearbeiten.

Und bevor jemand empfiehlt, ein rich-text-editor, dieser code ist nicht wirklich HTML. Es ist ein Brauch Dialekt.

Also wie kann ich die Zeilenumbrüche im IE?

InformationsquelleAutor cletus | 2009-03-18
  1. 17

    Wie es aussieht wird das mein problem: Der Internet Explorer innerHTML-Quirk:

    Jedoch innerHTML hat ein problem in
    Internet Explorer.

    Die HTML-Norm verlangt
    transformation auf die Anzeige von Inhalt.
    Alle Arten und Mengen von benachbarten
    Leerzeichen werden reduziert zu einem einzigen
    Raum.     Das ist eine gute Sache - nur wie
    ein Beispiel, erlaubt es mir zu viel
    der Zeilenumbrüche in dieser source-Datei
    ohne Angst, komisch
    Zeilenumbrüche, die im angezeigten text.

    Internet Explorer wendet diese
    Transformationen auf Zuordnung zu den
    innerHTML-Eigenschaft. Wie es scheint, ein
    gute Idee: es spart ein wenig Zeit
    während der Anzeige, denn wenn der
    in-memory-Repräsentation ist bereits
    normalisiert, dann ist der browser nicht
    zu normalisieren, Wann immer es braucht, um
    den text anzuzeigen.

    Gibt es Ausnahmen von der
    Normalisierung der Regel, wenn. Vor allem,
    dies sind die <textarea> - element, das
    <pre> - element und CSS-bewusst
    Browser-Elemente mit beliebigen Wert, aber
    normal für die white-space-Eigenschaft.

    Internet Explorer nicht respektieren
    diese speziellen Fälle. Die Dritte macht
    Ihre Optimierung eine schlechte Idee, weil
    white-space könnte sich zur Laufzeit ändern,
    zum Beispiel durch den DOM. In jedem
    Fall Internet Explorer normalisieren
    alle Zuweisungen an die innerHTML -
    Eigenschaft, wodurch die Wirkung
    unten gezeigt.

    Dieser text füllt die textarea auf der Seite
    Last. Auch dies enthält Zeilenumbrüche
    und mehrere Leerzeichen. Die Formatierung ist
    hier bewahrt, wie gut, außer dass
    der UA kann Bruchkanten.

    (Hervorhebung Hinzugefügt)

    Und in der Tat, wenn ich es zu ändern:

    <div id="div">
<pre>
...
</pre>
</div>

    und

    $("#div pre").text()

    oder einfach:

    <style type="text/css">
#div { white-space: pre }
</style>

    alles auf Magische Weise funktioniert.

    InformationsquelleAutor cletus
  2. 8

    Nicht sicher, ob dies würde helfen, aber vielleicht könnten Sie versuchen, diese:

    #div {
  white-space: pre;
}
    • Gearbeitet für mein IE8! Danke!
    InformationsquelleAutor Seb
  3. 3

    Sehen hier für einen workaround:

    Den hack zuerst duplizieren Sie das element
    Sie möchten die Inhalte, mit
    cloneNode().

    Als Nächstes erstellen Sie eine <pre> element mit
    createElement(), und dann hängen Sie Ihre
    geklonte Knoten zu.

    Nun können Sie die innerText, dass
    erstellen <pre> element, und löschen Sie einfach
    die temporären Objekte. Sie haben jetzt
    Leerzeichen erhaltene text 🙂

    var cloned = targetElement.cloneNode(true);
var pre = document.createElement("pre");
pre.appendChild(cloned);
var textContent = pre.textContent ?
  pre.textContent : pre.innerText;
delete pre;
delete cloned;

    Der Grund, warum ich clone das element ist
    weil der appendChild () - ziehen würde
    es aus dem DOM und den Schmerzen, die
    re-insert wieder an die richtige position
    in der DOM.

    Hoffentlich hilft dies einige Leute heraus
    dort 🙂

    InformationsquelleAutor vladr
Schreibe einen Kommentar