JS认为HTML文件会被浏览器解析为文档流,写在HTML里面的所有标签元素都可以从文档流中读取到。基于这个理论,JS定义了一个document对象,专门用来处理文档流。
要想获取一个元素,有两种方式:一种是根据元素的类名(class属性值),另一种是根据元素的ID。假设有一个input元素,JS获取该元素的方式如下:
<input class="isInput" id="input_first">
var element=document.getElementByClass("isInput")[0]或者
var element=document.getElementById("input_first")
需要注意的是,根据类名获取到的是一个数组,必须要通过下标才能获取到具体的某个元素。而根据ID获取到的则是具体的元素,所以常用的方式是用ID来获取。
js获取html元素的方式
+通过ID获取:getElementById('id属性值')
+通过标签名:getElementsByTagName('标签名')
+通过类名:getElementsByClassName('类名')
+通过name属性:getElementsByName('name属性值')
+通过选择器获取一个元素:querySelector
+通过选择器获取一组元素:querySelectorAll
1.获取id值为d1的html元素
将获取到的html元素称为DOM节点对象,必须传参数,参数是string类型,是获取元素的id。返回值只获取到一个元素,没有找到返回null。
2.通过标签名:getElementsByTagName('标签名')
参数是是获取元素的标签名属性,不区分大小写,根据标签名获取html元素, 返回的是一个数组(伪数组)
通过类名:getElementsByClassName('类名')
参数是元素的类名,返回值是一个类数组,没有找到返回空数组。
通过类名:getElementsByClassName('类名')
必须传参数,参数是是获取元素的name属性,返回值是一个类数组,没有找到返回空数组。
通过选择器获取一个元素:querySelector
参数是选择器,返回值只获取到第一个元素。
通过选择器获取一组元素:querySelectorAll
参数是选择器,返回值是一个数组。