Yshopnoosa.com

Hur man RemoveChild använder en strängvariabel

Hur man RemoveChild använder en strängvariabel

JavaScript-funktioner kan ta bort element i ett HTML- eller XML-dokument dynamiskt. Genom att inkludera JavaScript-funktioner i koden för en webbsida, kan du ändra innehållet på sidan medan användaren Visa och interagera med den. JavaScript-koden fungerar genom första att få en referens till det överordnade elementet och sedan instruerar webbläsaren att ta bort en av de underordnade elementen med metoden removeChild. Du kan ta bort ett specifikt underordnat element genom att hänvisa till det inom metodanropet. För att identifiera både underordnade och överordnade element, kan du använda text strängvariabler som representerar deras ID-attribut.

Instruktioner

1 Lägga till överordnade och underordnade element i dokumentet. Följande prov HTML-kod visar en enkel överordnade och underordnade trädstruktur en webbsida:< div id = "yttre" >yttre< div id = "inre" >inre< / div >< / div >

Egna strukturer kan innehålla flera element, som text, data och media innehåll. Yttre elementet tas bort den inre delen när JavaScript-funktionen körs.

2 Lägga till ett inmatningselement i din markering. En egen funktion får utföra på specifika händelser, men för demonstration kan du lägga till följande kod om du använder ett HTML-dokument:< input type = "knappen" value = "ta bort" onclick="removeElement()" / >

Detta skapar en grundläggande indata knappen element. Knappen är inställd att ringa en viss JavaScript-funktion när användaren trycker på den.

3 Lägga till JavaScript-kod i dokumentet. Följande exempelkod visar en JavaScript-avsnitt i HTML-huvudet element på en webbsida:< script type = "text/javascript" >funktion removeElement() {ta bort det underordnade elementet}< / script >

Din egen kod kan vara i en separat fil om du föredrar. Denna funktion översikt speglar angivna funktionsanropet i input-elementet, så att innehållet i detta utdrag ska köras när användaren trycker på knappen.

4 Definiera din elementet ID-attribut som string-variabler. Lägg till följande kod inuti din JavaScript-funktionen:var parentElement = "yttre";var childElement = "inre";

Dessa rader ange ID-attributvärden underordnade och överordnade element. Lägg till följande kod, förvärva en hänvisning till varje element i dokumentet:var outElem = document.getElementById(parentElement);var inElem = document.getElementById(childElement);

Koden har nu möjligheten att hänvisa till varje element, utföra ändringar på innehållet.

5 Lägga till JavaScript-kod för att ta bort det underordnade elementet. Infoga följande kod på din JavaScript-funktionen:outElem.removeChild(inElem);

Detta instruerar webbläsaren att ta bort det angivna underordnade elementet från överordnat. Spara filen och öppna den i en webbläsare. Klicka på knappen för att testa funktionen. Du bör se den inre delen försvinner, lämnar det yttre elementet.

Tips & varningar

  • Du kan eventuellt överföra elementet ID-attributet strängar som parametrar till funktionen.
  • JavaScript kan fungera oförutsägbart i vissa webbläsare, så se till att du testar dina sidor grundligt.