Umfassende Analyse von js-Selektoren-js-Tutorial-php.cn

Umfassende Analyse von js-Selektoren

怪我咯

Freigeben： 2017-04-01 09:13:49

Original

1326 Leute haben es durchsucht

Zu den nativen JS-Selektoren gehören getElementById, getElementsByName, getElementsByTagName und getElementsByClassName. Im Folgenden werde ich die Verwendung dieser vier Selektoren einzeln vorstellen.

1.getElementById (Element nach ID abrufen)

Verwendung: document.getElementById("Id"); ist der ID-Attributwert des abzurufenden Elements.

2.getElementsByName (Elemente über das Namensattribut abrufen)

Verwendung: document.getElementsByName("Name"); Name ist der Namensattributwert des abzurufenden Elements Geeignet zum Senden von Formulardaten. Wenn das Namensattribut festgelegt ist und das Element ein Formular, ein IMG, ein Iframe, ein Applet, eine Einbettung oder ein Objekt ist, wird im Dokumentobjekt automatisch ein Attribut erstellt, das nach dem Namensattributwert benannt ist. Sie können also über document.domName

3.getElementsByTagName (Elemente nach Elementnamen abrufen) referenzieren

Verwendung: document.getElementsByTagName(TagName); TagName ist der Tag-Name des Zu erhaltendes Element: Wenn TagName * ist, bedeutet dies, dass alle Elemente des Dokuments auch durch ein DOM-Element ersetzt werden können. Auf diese Weise kann jedoch nur die Teilmenge der Elemente hinter dem DOM-Element abgerufen werden.

4.getElementsByClassName (Elemente über CSS-Klassen abrufen)

Verwendung: document.getElementsByClassName(ClassName); Wenn Sie mehrere gleichzeitig erhalten möchten, trennen Sie diese durch Leerzeichen nach jeder CSS-Klasse. Beispielsweise ruft document.getElementsByClassName("class2 class1") Elemente der Stile class1 und class2 ab. Das Dokument kann auch durch ein DOM-Element ersetzt werden, sodass nur eine Teilmenge der Elemente hinter dem DOM-Element abgerufen werden kann.

<!DOCTYPE html>
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>demo</title>
</head>
<body>
<p>我是通过标签获取</p>
<p id="box">我是通过id获取</p>
<p class="box1">我是通过class获取</p>
<form action="" name="box2">
  我是通过name获取
</form>
</body>
<script type="text/javascript">
  var p = document.getElementsByTagName("p");
  var box = document.getElementById("box");
  var box1 = document.getElementsByClassName("box1");
  var box2 = document.getElementsByName("box2");
</script>
</html

Nach dem Login kopieren

Das obige ist der detaillierte Inhalt vonUmfassende Analyse von js-Selektoren. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!