Der Unterschied zwischen innerHTML, innerText und äußereHTML in JavaScript

Ich habe kürzlich einige JavaScript-Kenntnisse zusammengefasst und mit Ihnen geteilt. In diesem Artikel geht es hauptsächlich um die Verwendungsunterschiede von innerHTML, innerText und äußerer HTML. Er hat einen gewissen Referenzwert und kann Ihnen hoffentlich weiterhelfen. Verwendung:

<div id="test">
   <span style="color:red">test1</span> test2
</div>

kann in JS verwendet werden:

test.innerHTML:

Das heißt, vom Anfang an das Objekt Der gesamte Inhalt von der Position bis zur Endposition, einschließlich HTML-Tags.

Der Wert von test.innerHTML im obigen Beispiel ist „test1 test2 ".

test.innerText:

Inhalt von der Startposition bis zur Endposition, aber das HTML-Tag

text.innerTest oben wird entfernt Beispiel Der Wert ist „test1 test2“, wobei das Span-Tag entfernt wurde.

test.outerHTML:

Es enthält nicht nur den gesamten Inhalt von innerHTML, sondern auch das Objekt-Tag selbst.

Der Wert von text.outerHTML im obigen Beispiel ist

test1 test2

Vollständiges Beispiel:

<div id="test">
   <span style="color:red">test1</span> test2
</div>
innerHTML内容
inerHTML内容
outerHTML内容

Besonderer Hinweis:

innerHTML ist ein Attribut, das den W3C-Standards entspricht, während innerText nur für IE-Browser gilt long as Verwenden Sie nach Möglichkeit innerHTML und weniger innerText. Wenn Sie Inhalte ohne HTML-Tags ausgeben möchten, können Sie innerHTML verwenden, um den Inhalt mit HTML-Tags abzurufen, und dann reguläre Ausdrücke verwenden, um die HTML-Tags zu entfernen entspricht den W3C-Standards. Beispiel:

Kein HTML, konform mit W3C-Standards.

Das obige ist der detaillierte Inhalt vonDer Unterschied zwischen innerHTML, innerText und äußereHTML in JavaScript. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!