Hur man konverterar HTML till vanlig text i Javascript

...

Använd JavaScript för att konvertera HTML-element till vanlig text.

En av de mer användbara sakerna du kan göra med JavaScript-skriptspråket är att manipulera och arbeta med Document Object Model (eller "DOM") för ett HTML-dokument. DOM för ett HTML-dokument är en konvention för att representera innehållet i det dokumentet. Det ger webbläsare och skriptspråk som JavaScript ett sätt att interagera med de olika elementen som utgör dokumentet. Med hjälp av JavaScript och en webbsidas DOM kan du enkelt konvertera HTML till vanlig text.

Steg 1

Lägg till en SCRIPT-deklaration i HEAD-delen av ditt HTML-dokument. SCRIPT-taggen definierar ett skript på klientsidan som JavaScript. Din SCRIPT-tagg måste ha sitt "type"-attribut inställt på "text/javascript" så att hela SCRIPT-deklarationen ska lyda enligt följande: (där JavaScript-koden går mellan de två taggarna).

Dagens video

Steg 2

Definiera en JavaScript-funktion som tar en sträng som parameter. Denna strängparameter innehåller HTML som du kommer att konvertera till vanlig text.

Steg 3

Skapa ett tillfälligt DIV-element i din JavaScript-funktion med metoden "createElement()".

Steg 4

Tilldela din funktions strängparameter till din tillfälliga DIV: s "innerHTML"-attribut.

Steg 5

Skapa en temporär strängvariabel i din funktion.

Steg 6

Ta tag i ren textinnehållet i din temporära DIV med hjälp av dess "textContent" och "innerText" attribut och tilldela den till din temporära strängvariabel. På grund av problem med kompatibilitet över webbläsare kommer både "textContent" och "innerText" att definieras i vissa webbläsare och odefinierade i andra, men den ena eller den andra kommer att definieras i alla versioner av alla större webbläsare.

Steg 7

Returnera värdet som innehas av din tillfälliga sträng med hjälp av en "return"-sats. Detta kommer att returnera värdet för vanlig text för din konverterade HTML.

Dricks

Istället för att använda IF-THEN-satser för att kontrollera kompatibilitet mellan webbläsare och för att bestämma om du vill använda "textContent" eller "innerText" i din funktion, tilldela helt enkelt ditt temporära DIV-elements oformaterade textvärde till din temporära strängvariabel enligt följande: var tmpString = tmpDiv.textContent || tmpDiv.innerText.