Kuidas HTML-i Javascriptis lihttekstiks teisendada

...

Kasutage JavaScripti, et teisendada HTML-elemendid lihttekstiks.

Üks kasulikumaid asju, mida saate JavaScripti skriptikeelega teha, on HTML-dokumendi dokumendiobjekti mudeli (või "DOM") manipuleerimine ja sellega töötamine. HTML-dokumendi DOM on konventsioon selle dokumendi sisu esitamiseks. See annab võimaluse veebibrauseritele ja skriptikeeltele, nagu JavaScript, suhelda selle dokumendi koostavate erinevate elementidega. JavaScripti ja veebilehe DOM-i abil saate HTML-i hõlpsalt lihttekstiks teisendada.

Samm 1

Lisage oma HTML-dokumendi jaotisesse HEAD deklaratsioon SCRIPT. Märgend SCRIPT määrab kliendipoolse skripti, näiteks JavaScripti. Teie SCRIPT-märgendi atribuut "type" peab olema seatud väärtusele "text/javascript", et kogu SCRIPT-deklaratsioon peaks olema järgmine: (kus JavaScripti kood läheb kahe sildi vahele).

Päeva video

2. samm

Määratlege JavaScripti funktsioon, mis võtab parameetrina ühe stringi. See stringi parameeter sisaldab HTML-i, mille teisendate lihttekstiks.

3. samm

Looge oma JavaScripti funktsiooni sees ajutine DIV-element, kasutades meetodit "createElement()".

4. samm

Määrake oma funktsiooni stringi parameeter oma ajutise DIV-i atribuudile "innerHTML".

5. samm

Looge oma funktsioonis ajutine stringimuutuja.

6. samm

Haarake oma ajutise DIV-i lihtteksti sisu, kasutades selle atribuute "textContent" ja "innerText", ja määrake see oma ajutisele stringimuutujale. Brauseriülese ühilduvuse probleemide tõttu määratletakse nii tekstisisu kui ka sisemine tekst mõnes veebibrauserid ja teistes määramata, kuid üks või teine ​​defineeritakse kõigis peamistes versioonides brauserid.

7. samm

Tagastada oma ajutise stringi väärtus, kasutades käsku "return". See tagastab teie teisendatud HTML-i lihtteksti väärtuse.

Näpunäide

Selle asemel, et kasutada IF-THEN-lauseid, et kontrollida brauseritevahelist ühilduvust ja otsustada, kas kasutada funktsioonis tekstisisu või innerText, lihtsalt määrake oma ajutise DIV-elemendi lihtteksti väärtus oma ajutisele stringimuutujale järgmiselt: var tmpString = tmpDiv.textContent || tmpDiv.innerText.