Beispiele für Knotenoperationen in JS
In diesem Artikel werden hauptsächlich Beispiele für Knotenoperationen in JS vorgestellt, hauptsächlich in Form von Code. Ich hoffe, er kann Ihnen helfen.
Knoten hinzufügen, löschen, ändern und überprüfen
<!DOCTYPE html><html lang="en"><head>
<meta charset="UTF-8">
<title>Title</title>
<style>
.p1,.p2,.p3,.p4{ width: 300px; height: 100px; }
.p1{ background-color: green; }
.p2{ background-color: yellow; }
.p3{ background-color: rebeccapurple; }
.p4{ background-color: deeppink; }
</style></head><body><p class="p1">
<button onclick="add()">add</button>
hello p1</p><p class="p2">
<button onclick="del()">del</button>
hello p2</p><p class="p3">
<button onclick="change()">change</button>
<p>hello p3</p></p><p class="p4">hello p4</p><script>###############增加节点###################### function change() {
var img=document.createElement("img");//<img src="">
//img.setAttribute("src","meinv.jpg");
img.src="meinv.jpg"; var ele=document.getElementsByTagName("p")[0]; var father=document.getElementsByClassName("p3")[0];
father.replaceChild(img,ele)
}
###############修改节点###################### function add() {
var ele=document.createElement("p");//<p></p>
ele.innerHTML="<h1>hello p</h1>"; //ele.innerText="<h1>hello p</h1>";
ele.style.color="red";
ele.style.fontSize="10px"; var father=document.getElementsByClassName("p1")[0];
father.appendChild(ele)
}
###############删除节点###################### function del() {
var father=document.getElementsByClassName("p1")[0]; var son=father.getElementsByTagName("p")[0];
father.removeChild(son)
}</script></body></html>Zwei Möglichkeiten, Ereignisse mit JS zu binden
<!DOCTYPE html><html lang="en"><head>
<meta charset="UTF-8">
<title>Title</title></head><body><p onclick="func(this)">hello</p><p>hello p</p><script>
// 绑定事件方式一
function func(self) {
console.log(self)
alert(1234)
} // 绑定事件方式二
var ele=document.getElementsByTagName("p")[0]
ele.onclick=function () {
console.log(ele);
console.log(this);// alert(6666)
}</script></body></html>Das Klassenattribut von JS
<script>
var ele=document.getElementsByTagName("p")[0];
# class的名称
console.log(ele.className);
# 以列表返回class中值
console.log(ele.classList[0]);
# 以列表返回class中值
console.log(ele.classList[1]);
# 向列表中增加元素
ele.classList.add("hide")
console.log(ele.className);</script>Ereignisobjekt: kapselt Ereignisinformationen
kann verwendet werden, um die Ausbreitung von Ereignissen zu verhindern
<!DOCTYPE html><html lang="en"><head>
<meta charset="UTF-8">
<title>Title</title></head><body><form action="" id="form1">
<input type="text" name="username">
<input type="submit" value="提交"></form><script>
var ele=document.getElementById("form1");
ele.onsubmit=function (e) {// console.log("hello")
alert(1234); // 方式一 返回false
return false
// 方式二 preventDefault函数
//e.preventDefault()
}</script></body></html>Verwandte Empfehlungen:
Zusammenfassung nativer JavaScript-Operationen auf dom Knoten
Das obige ist der detaillierte Inhalt vonBeispiele für Knotenoperationen in JS. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!
Heiße KI -Werkzeuge
Undresser.AI Undress
KI-gestützte App zum Erstellen realistischer Aktfotos
AI Clothes Remover
Online-KI-Tool zum Entfernen von Kleidung aus Fotos.
Undress AI Tool
Ausziehbilder kostenlos
Clothoff.io
KI-Kleiderentferner
Video Face Swap
Tauschen Sie Gesichter in jedem Video mühelos mit unserem völlig kostenlosen KI-Gesichtstausch-Tool aus!
Heißer Artikel
Heiße Werkzeuge
Notepad++7.3.1
Einfach zu bedienender und kostenloser Code-Editor
SublimeText3 chinesische Version
Chinesische Version, sehr einfach zu bedienen
Senden Sie Studio 13.0.1
Leistungsstarke integrierte PHP-Entwicklungsumgebung
Dreamweaver CS6
Visuelle Webentwicklungstools
SublimeText3 Mac-Version
Codebearbeitungssoftware auf Gottesniveau (SublimeText3)
Heiße Themen
1391
52
Tutorial zur PyCharm-Nutzung: Führt Sie ausführlich durch die Ausführung des Vorgangs
Feb 26, 2024 pm 05:51 PM
PyCharm ist eine sehr beliebte integrierte Entwicklungsumgebung (IDE) für Python. Sie bietet eine Fülle von Funktionen und Tools, um die Python-Entwicklung effizienter und komfortabler zu gestalten. Dieser Artikel führt Sie in die grundlegenden Betriebsmethoden von PyCharm ein und stellt spezifische Codebeispiele bereit, um den Lesern einen schnellen Einstieg zu erleichtern und sich mit der Bedienung des Tools vertraut zu machen. 1. Laden Sie PyCharm herunter und installieren Sie es. Zuerst müssen wir zur offiziellen Website von PyCharm gehen (https://www.jetbrains.com/pyc).
Was ist Sudo und warum ist es wichtig?
Feb 21, 2024 pm 07:01 PM
sudo (Superuser-Ausführung) ist ein Schlüsselbefehl in Linux- und Unix-Systemen, der es normalen Benutzern ermöglicht, bestimmte Befehle mit Root-Rechten auszuführen. Die Funktion von sudo spiegelt sich hauptsächlich in den folgenden Aspekten wider: Bereitstellung von Berechtigungskontrolle: sudo erreicht eine strikte Kontrolle über Systemressourcen und sensible Vorgänge, indem es Benutzern erlaubt, vorübergehend Superuser-Berechtigungen zu erhalten. Normale Benutzer können über sudo bei Bedarf nur vorübergehende Berechtigungen erhalten und müssen sich nicht ständig als Superuser anmelden. Verbesserte Sicherheit: Durch die Verwendung von sudo können Sie die Verwendung des Root-Kontos bei Routinevorgängen vermeiden. Die Verwendung des Root-Kontos für alle Vorgänge kann zu unerwarteten Systemschäden führen, da für jeden fehlerhaften oder nachlässigen Vorgang die vollen Berechtigungen gewährt werden. Und
Schritte und Vorsichtsmaßnahmen für die Linux-Bereitstellung
Mar 14, 2024 pm 03:03 PM
Betriebsschritte und Vorsichtsmaßnahmen für LinuxDeploy LinuxDeploy ist ein leistungsstarkes Tool, mit dem Benutzer schnell verschiedene Linux-Distributionen auf Android-Geräten bereitstellen können, sodass Benutzer ein vollständiges Linux-System auf ihren Mobilgeräten erleben können. In diesem Artikel werden die Betriebsschritte und Vorsichtsmaßnahmen von LinuxDeploy ausführlich vorgestellt und spezifische Codebeispiele bereitgestellt, um den Lesern zu helfen, dieses Tool besser zu nutzen. Arbeitsschritte: LinuxDeploy installieren: Zuerst installieren
Was tun, wenn Sie vergessen, F2 für das Win10-Startkennwort zu drücken?
Feb 28, 2024 am 08:31 AM
Vermutlich haben viele Benutzer zu Hause mehrere ungenutzte Computer und haben das Einschaltpasswort völlig vergessen, weil sie längere Zeit nicht benutzt wurden. Sie möchten also wissen, was zu tun ist, wenn sie das Passwort vergessen? Dann lasst uns gemeinsam einen Blick darauf werfen. Was tun, wenn Sie vergessen, F2 für das Win10-Startkennwort zu drücken? 1. Drücken Sie den Netzschalter des Computers und drücken Sie dann beim Booten F2 (verschiedene Computermarken haben unterschiedliche Tasten zum Aufrufen des BIOS). 2. Suchen Sie in der BIOS-Schnittstelle nach der Sicherheitsoption (der Speicherort kann je nach Computermarke unterschiedlich sein). Normalerweise im Einstellungsmenü oben. 3. Suchen Sie dann die Option „SupervisorPassword“ und klicken Sie darauf. 4. Zu diesem Zeitpunkt kann der Benutzer sein Passwort sehen und gleichzeitig die Option „Aktiviert“ daneben finden und auf „Dis“ umstellen.
Huawei Mate60 Pro Screenshot-Bedienschritte teilen
Mar 23, 2024 am 11:15 AM
Mit der Beliebtheit von Smartphones ist die Screenshot-Funktion zu einer der wesentlichen Fähigkeiten für die tägliche Nutzung von Mobiltelefonen geworden. Als eines der Flaggschiff-Handys von Huawei hat die Screenshot-Funktion des Huawei Mate60Pro natürlich große Aufmerksamkeit bei den Nutzern auf sich gezogen. Heute werden wir die Screenshot-Bedienungsschritte des Huawei Mate60Pro-Mobiltelefons teilen, damit jeder bequemer Screenshots machen kann. Erstens bietet das Huawei Mate60Pro-Mobiltelefon eine Vielzahl von Screenshot-Methoden, und Sie können die Methode auswählen, die Ihren persönlichen Gewohnheiten entspricht. Im Folgenden finden Sie eine detaillierte Einführung in mehrere häufig verwendete Abfangfunktionen:
PHP PDO-Tutorial: Ein Leitfaden für Fortgeschrittene von den Grundlagen bis zur Beherrschung
Feb 19, 2024 pm 06:30 PM
1. Einführung in PDO PDO ist eine Erweiterungsbibliothek von PHP, die eine objektorientierte Möglichkeit zum Betrieb der Datenbank bietet. PDO unterstützt eine Vielzahl von Datenbanken, einschließlich MySQL, Postgresql, Oracle, SQLServer usw. PDO ermöglicht Entwicklern die Verwendung einer einheitlichen API zum Betrieb verschiedener Datenbanken, wodurch Entwickler problemlos zwischen verschiedenen Datenbanken wechseln können. 2. PDO stellt eine Verbindung zur Datenbank her. Um PDO zum Herstellen einer Verbindung zur Datenbank zu verwenden, müssen Sie zunächst ein PDO-Objekt erstellen. Der Konstruktor des PDO-Objekts erhält drei Parameter: Datenbanktyp, Hostname, Datenbankbenutzername und Passwort. Der folgende Code erstellt beispielsweise ein Objekt, das eine Verbindung zu einer MySQL-Datenbank herstellt: $dsn="mysq
Erfahren Sie Best-Practice-Beispiele für die Zeigerkonvertierung in Golang
Feb 24, 2024 pm 03:51 PM
Golang ist eine leistungsstarke und effiziente Programmiersprache, mit der sich verschiedene Anwendungen und Dienste entwickeln lassen. In Golang sind Zeiger ein sehr wichtiges Konzept, das uns helfen kann, Daten flexibler und effizienter zu verwalten. Die Zeigerkonvertierung bezieht sich auf den Prozess der Zeigeroperation zwischen verschiedenen Typen. In diesem Artikel werden anhand konkreter Beispiele die Best Practices der Zeigerkonvertierung in Golang erläutert. 1. Grundkonzepte In Golang hat jede Variable eine Adresse, und die Adresse ist der Speicherort der Variablen im Speicher.
PHP-String-Manipulation: eine praktische Möglichkeit, Leerzeichen effektiv zu entfernen
Mar 24, 2024 am 11:45 AM
PHP-String-Operation: Eine praktische Methode zum effektiven Entfernen von Leerzeichen Bei der PHP-Entwicklung kommt es häufig vor, dass Sie Leerzeichen aus einem String entfernen müssen. Das Entfernen von Leerzeichen kann die Zeichenfolge sauberer machen und die nachfolgende Datenverarbeitung und -anzeige erleichtern. In diesem Artikel werden mehrere effektive und praktische Methoden zum Entfernen von Leerzeichen vorgestellt und spezifische Codebeispiele angehängt. Methode 1: Verwenden Sie die in PHP integrierte Funktion trim(). Die in PHP integrierte Funktion trim() kann Leerzeichen an beiden Enden der Zeichenfolge entfernen (einschließlich Leerzeichen, Tabulatoren, Zeilenumbrüche usw.), was sehr praktisch und einfach ist benutzen.
