JavaScript-functies kunnen toevoegen en verwijderen van elementen in een webpagina. De HTML-elementen op een webpagina zijn onderverdeeld in een ""-boomstructuur, die toegankelijk is voor JavaScript-functies binnen de pagina. Door te navigeren deze structuur, vermag een JavaScript-functie eerst Zoek een element en deze vervolgens verwijdert met een verwijzing naar het bovenliggende element. JavaScript-functies om te verwijderen van elementen maken is niet typisch moeilijk en is een goede vaardigheid te leren als u Web programmeren vaardigheden ontwikkelen.
Het maken van uw Web-pagina met het element dat u wilt verwijderen. Voer de volgende code in een nieuw bestand in een teksteditor en sla het met ". HTML"als de bestandsextensie:
Verwijder MeDit is een eenvoudig voorbeeldpagina om aan te tonen van het beginsel van het verwijderen van een HTML-element, zodat de pagina alleen het element dat bevat moet worden verwijderd. Het element is toegewezen een "onclick"-functie, wat betekent dat wanneer de gebruiker erop klikt, een JavaScript-functie zal worden genoemd en het kenmerk van de "id" element doorgegeven.
Maak uw JavaScript-functie. Voer een gebied voor code in de head-sectie van uw pagina, tussen het openen en sluiten van koptags:
//function called within the page
function removeElem(divID) {
//remove the element here
}
Hiermee wordt de functie die wordt aangeroepen op het te klikken op het pagina-element. Merk op dat de naam van de functie overeenkomt met het element 'onclick'-functie. De parameter "divID" geeft de ID-waarde doorgegeven wanneer het element wordt geklikt.
Zoek naar het element wordt geklikt. Voeg de volgende binnen uw JavaScript-functie, tussen het openen en sluiten functie haakjes:
var childElem = document.getElementById(divID);
Deze maakt gebruik van de doorgegeven waarde van de ID op zoek naar het element binnen de HTML-pagina. De variabele "childElem" heeft nu een aanwijzer op het element waarop is geklikt. Vervolgens kunt u deze verwijzing voor verdere verwerking.
Zoek het bovenliggende element van het element wordt geklikt. Als wilt verwijderen een element, moet u een verwijzing naar de bovenliggende verwerven en vervolgens instrueren dit element te verwijderen van het onderliggende element dat u probeert te vernietigen. Voeg de volgende code om het verkrijgen van een verwijzing naar de ouder:
var parentElem = childElem.parentNode;
Uw code is nu een verwijzing naar het element moet worden verwijderd en het bovenliggende element.
Het element van uw pagina verwijderen. Voeg de volgende code, de verwijdering operatie uitvoeren:
parentElem.removeChild(childElem);
Dit roept een methode op het bovenliggende element, instructie om te verwijderen van de kind-element dat is opgegeven als een parameter. Sla het bestand op en open de pagina in een webbrowser te testen. Klik op de tekst van het element en u moeten zien verdwijnen. Het opnieuw testen, Vernieuw de pagina en klikt u nogmaals op.
- JavaScript-functies kunnen openen en verwijderen van elk pagina-element.
- Wees voorzichtig met het verwijderen van elementen in het geval je per ongeluk naar verwijzen en verwijderen van verkeerde.