Wie kann ich in JavaScript „true' zurückgeben, wenn das übergeordnete Element untergeordnete Elemente enthält?-js-Tutorial-php.cn

Wie kann ich in JavaScript „true' zurückgeben, wenn das übergeordnete Element untergeordnete Elemente enthält?

PHPz

Freigeben： 2023-09-03 21:01:08

nach vorne

705 Leute haben es durchsucht

如果父元素包含子元素，JavaScript 中如何返回 true？

In diesem Tutorial erfahren Sie, wie Sie in JavaScript „true“ zurückgeben, wenn ein übergeordnetes Element ein untergeordnetes Element enthält. Angenommen, Sie haben zwei HTML-Elemente, ein übergeordnetes Element und ein untergeordnetes Element, und möchten wissen, ob das übergeordnete Element das untergeordnete Element enthält.

Verwendung der Node.contains()-Methode

Die contains()-Methode der Node-Schnittstelle gibt einen booleschen Wert zurück, der angibt, ob der Knoten ein Nachkomme des angegebenen Knotens ist.

Wenn Sie wissen möchten, ob der übergeordnete Knoten ein Element ist, das untergeordnete Elemente enthält, können Sie die Methode Node.contains() verwenden.

Dies ist ein einfaches Beispiel –

<div id="parent">
   <p id="child">Some text</p>
</div>

Nach dem Login kopieren

Der folgende JavaScript-Codeausschnitt prüft, ob ein übergeordnetes Element ein untergeordnetes Element enthält.

var parent = document.getElementById("parent");
var child = document.getElementById("child");

document.getElementById("result").innerHTML = parent.contains(child) 
// returns true

Nach dem Login kopieren

Im obigen Code verwenden wir die Methode getElementById(), um die Referenz der übergeordneten und untergeordneten Elemente abzurufen.

Dann verwenden wir parent.contains(child), um zu sehen, ob das übergeordnete Element untergeordnete Elemente enthält.

Beispiel

Hier ist der vollständige HTML-Code -

<html>
<head>
   <title>Examples</title>
</head>
<body>
   <div id="parent">
      <p id="child"></p>
   </div>
   <div id="result"></div>
   <script>
      var parent = document.getElementById("parent");
      var child = document.getElementById("child");
      document.getElementById("result").innerHTML ="Does parent contain child: "+ parent.contains(child)
   </script>
</body>
</html>

Nach dem Login kopieren

Verwendung der Methode hasChildNodes()

Eine andere Möglichkeit, zu überprüfen, ob ein übergeordnetes Element untergeordnete Elemente enthält, ist die Verwendung der Methode hasChildNodes().

Gibt true zurück, wenn die Methode hasChildNodes() untergeordnete Elemente enthält.

Dies ist ein einfaches Beispiel -

<div id="parent">
   <p id="child">Some text</p>
</div>

Nach dem Login kopieren

Siehe den JavaScript-Code unten -

var parent = document.getElementById("parent");
var child = document.getElementById("child");

document.getElementById("result").innerHTML = parent.hasChildNoodes();

Nach dem Login kopieren

Im obigen Code verwenden wir die Methode getElementById(), um die Referenz der übergeordneten und untergeordneten Elemente abzurufen.

Dann verwenden wir die Methode hasChildNodes, um zu prüfen, ob das übergeordnete Element vorhanden ist und ob das Element untergeordnete Elemente hat.

Beispiel

Hier ist der vollständige HTML-Code -

<!doctype html>
<html>
<head>
   <title>Examples</title>
</head>
<body>
   <div id="result"></div>
   <div id="parent">
      <p id="child"></p>
   </div>
   <script>
      var parent = document.getElementById("parent");
      var child = document.getElementById("child");
      document.getElementById("result").innerHTML = parent.hasChildNodes();
   </script>
</body>
</html>

Nach dem Login kopieren

Zusammenfassend lässt sich sagen, dass es mehrere Möglichkeiten gibt, zu überprüfen, ob ein übergeordnetes Element untergeordnete Elemente enthält. Sie können die Methode Node.contains() oder hasChildNodes() verwenden.

Das obige ist der detaillierte Inhalt vonWie kann ich in JavaScript „true' zurückgeben, wenn das übergeordnete Element untergeordnete Elemente enthält?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!