概念: 文档对象模型(Document Object Model,简称DOM),是W3C组织推荐的处理可扩展标记语言的标准编程接口。 DOM的设计是以对象管理组织(OMG)的规约为基础的,因此可以用于任何编程语言。Dom技术使得用户页面可以动态地变化,如可以动态地显示或隐藏一个元素,改变它们的属性,增加一个元素等,Dom技术使得页面的交互性大大地增强。 通俗理解: 把页面上的内容转换成对象的形式,通过操作对象,达到操作页面上标签和标签属性的一组方法
**概念: **document对象代表在浏览器中加载的页面
什么是元素?
html中的标签在DOM中称为元素 为什么要获取页面上的元素呢? 因为:我们想要操作页面上的元素,首先需要获取到对应的元素,然后才能进行后续操作
语法: document.getElementById('id名');
作用: 在整个文档中查找id名为传入的值的元素,如果没有返回null
//html
<div id="box"></div>
//js
//在整个文档中查找id为box的元素
var div = document.getElementById('box');
console.log(div); //返回的是对应的元素
语法: document.getElementsByTagName('标签名');
作用: 在整个文档中查找所有标签名为传入的值的元素,将这些所有符合条件元素的存放到一个伪数组中返回出来,如果没有就返回一个空的伪数组
<div>div1</div>
<div>div2</div>
<div>div3</div>
<script>
var divs = document.getElementsByTagName("div");
for(var i =0;i<divs.length;i++){
console.log(divs[i])
}
</script>