Hogyan lehet HTML-t egyszerű szöveggé alakítani Javascriptben

Az egyik hasznosabb dolog, amit a JavaScript szkriptnyelvvel tehet, a HTML-dokumentumok dokumentumobjektum-modelljének (vagy "DOM"-nak) kezelése és az azzal való munka. A HTML-dokumentumok DOM-ja egy egyezmény a dokumentum tartalmának megjelenítésére. Módot biztosít a webböngészők és a szkriptnyelvek, például a JavaScript számára, hogy interakcióba lépjenek a dokumentumot alkotó különböző elemekkel. A JavaScript és a weboldal DOM használatával könnyedén konvertálhatja a HTML-t egyszerű szöveggé.

1. lépés

Adjon hozzá egy SCRIPT deklarációt a HTML-dokumentum HEAD részéhez. A SCRIPT címke olyan ügyféloldali szkriptet határoz meg, mint például a JavaScript. A SCRIPT címkéjének "type" attribútuma "text/javascript" értékre kell, hogy legyen, hogy a teljes SCRIPT deklaráció a következőképpen szóljon:(ahol a JavaScript kód a két címke közé kerül).

2. lépés

Határozzon meg egy JavaScript függvényt, amely egy karakterláncot vesz paraméterként. Ez a karakterlánc-paraméter tartalmazza azt a HTML-kódot, amelyet egyszerű szöveggé konvertál.

3. lépés

Hozzon létre egy ideiglenes DIV elemet a JavaScript-függvényen belül a "createElement()" metódussal.

4. lépés

Rendelje hozzá a függvény karakterlánc-paraméterét az ideiglenes DIV „innerHTML” attribútumához.

5. lépés

Hozzon létre egy ideiglenes karakterlánc-változót a függvényében.

6. lépés

Fogja meg az ideiglenes DIV egyszerű szöveges tartalmát a "textContent" és az "innerText" attribútumok használatával, és rendelje hozzá az ideiglenes karakterlánc-változóhoz. A böngészők közötti kompatibilitási problémák miatt egyes webböngészőkben a "textContent" és az "innerText" is definiálva lesz, míg másokban nincs meghatározva, de az egyik vagy a másik az összes főbb böngésző összes verziójában meg lesz határozva.

7. lépés

Adja vissza az ideiglenes karakterlánc által tárolt értéket a "return" utasítás használatával. Ez a konvertált HTML egyszerű szöveges értékét adja vissza.

Tipp

Ahelyett, hogy IF-THEN utasításokat használna a böngészők közötti kompatibilitás ellenőrzésére és annak eldöntésére, hogy a „textContent” vagy az „innerText” függvényt használja-e a függvényben, egyszerűen rendelje hozzá az ideiglenes DIV elem egyszerű szöveges értékét az ideiglenes karakterlánc-változóhoz a következőképpen:var tmpString =tmpDiv.textContent || tmpDiv.innerText.