Home  >  Article  >  Web Front-end  >  How to view the child nodes of an element in the current document? There are several ways

How to view the child nodes of an element in the current document? There are several ways

云罗郡主
云罗郡主forward
2018-10-17 15:39:182885browse

What this article brings to you is how to view the child nodes of an element in the current document? There are several methods, which have certain reference value. Friends in need can refer to them. I hope it will be helpful to you.

Source code:

<!DOCTYPE html>
<html lang = "zh-CN">
<head>
<meta charset="utf-8"/>
<title></title>
</head>
<body>
<div>Hello</div>
</body>
</html>

Method one:

//直接在html文档中嵌入javascript代码,如下:
<script>
var b = document.getElementsByTagName("body");
//当前文档中值存在一个body元素时,直接使用b[0]获取
var childNodes_count = b[0].childNodes;
//返回由子节点元素构成的数组,分别为text、div、text、script、text(text为空白文本节点)
</script>

Method two:

//在调试工具中添加一个watch中输入
var b = document.getElementsByTagName("body");
//再添加一个监听(watch)输入
b[0].childNodes
//子节点有text、div、text

Method three:

//在Console中输入
var b = document.getElementsByTagName("body");
//切换到Sources中,在watch中输入
b[0].childNodes
//子节点有text、div、text

The above is how to view the child nodes of an element in the current document? There are all introductions to several methods. If you want to know more about HTML video tutorial, please pay attention to the PHP Chinese website.

The above is the detailed content of How to view the child nodes of an element in the current document? There are several ways. For more information, please follow other related articles on the PHP Chinese website!

Statement:
This article is reproduced at:csdn.net. If there is any infringement, please contact admin@php.cn delete