JavaScript - 获取页面元素的四种方法

测试源代码




    
    



  • HTML5
  • CSS3
  • JavaScript

1.用标签名来获取元素- document.getElementByTagName

获取页面中全部的 li 元素 (参数为标签名)

以数组形式保存

访问元素内容

JavaScript - 获取页面元素的四种方法_第1张图片

修改元素内容

2.用元素 id 来获取 - document.getElementById (参数为id内容)

以文本形式保存

访问元素内容

修改元素内容

JavaScript - 获取页面元素的四种方法_第2张图片

3.用 class 类名来获取元素 - document.getElementsByClassName

返回一个数组,类属性list进行修饰的一个对象

参数为clss属性值

访问元素内容

JavaScript - 获取页面元素的四种方法_第3张图片

4.用 CSS 选择符来获取 - document.querySelector 

                        - document.querySelectorAll

document.querySelector 只能获取一个元素内容

使用 querySelectorAll 可获取多个内容

访问元素内容

JavaScript - 获取页面元素的四种方法_第4张图片

修改元素内容

JavaScript - 获取页面元素的四种方法_第5张图片

你可能感兴趣的:(JavaScript - 获取页面元素的四种方法)