Question

如何根据HTML标签的id属性和标签名称来获取节点

Answer 1

需要准备的材料分别有：电脑、浏览器、html编辑器。

1、首先，打开html编辑器，新建html文件，例如：index.html。

2、在index.html中的<script>标签，输入js代码：

var a = '通过id获取：' + $('#test').html();

var b = '通过标签名获取：' + $('div').html();

$('body').append('<br/>' + a);

$('body').append('<br/>' + b);

3、浏览器运行index.html页面，此时成功通过id和标签名称获取到了节点并打印了节点内容。

Answer 2

对DOM节点进行操作之前，首先要获取DOM节点。获取DOM节点的方法有很多，可以根据 id属性 、 标签名称 获取。
getElementById( )方法
根据HTML标签的id属性来获取DOM节点请使用 getElementById( ) 方法。该方法返回一个节点对象。
语法：document.getElementById(id) 其中，id 为HTML标签的 id 属性。
例如，获得id="demo"的节点的语句为：document.getElementById("demo");

getElementsByTagName( )方法
根据HTML标签名称来获取DOM节点请使用 getElementsByTagName( ) 方法。该方法将得到的元素节点作为一个数组返回。
语法：nodeObject.getElementsByTagName(tagName)
其中，nodeObject 为元素节点，tagName 为HTML标签的名称。
注意：getElementsByTagName() 方法既可以查找整个 HTML 文档中的所有节点，也可以查找某个节点的子节点，使用时必须要指定查找范围，即指明 nodeObject 。
例如，获得HTML文档中所有的<div>标签：
document.getElementsByTagName("div");

获得id=”demo”的标签内部的所有<div>标签：
document.getElementById("demo").getElementsByTagName("div");