DOM

• 概念:Document Object Model，文档对象模型.
• 将标记语言的各个组成部分封装为对应的对象:
  • Document:整个文档对象
  • Element:元素对象
  • Attribute:属性对象Text:文本对象
  • Comment:注释对象

Element:元素对象

• HTML中的Element对象可以通过Document对象获取，而Document对象是通过window对象获取的。
• Document对象中提供了以下获取Element元素对象的函数:

1. 根据id属性值获取，返回单个Element对象

var h1 = document.getE1ementById( 'h1 ' ) ;

2. 根据标签名称获取，返回Element对象数组

var divs = document.getElementsByTagName( " div " );

3. 根据name属性值获取，返回Element对象数组

var hobbys = document.getElementsByName( " hobby ' );

4. 根据class属性值获取，返回Element对象数组

var clss = document.getElementsByclassName( 'cls ');

代码

<script>

    // 1.获取Element元素
    // 1.1获取元素 -根据id获取
    var img = document.getElementById('h1');
    alert(img);

    // 1.2获取元素-根据标签获取 -div
    var divs = document.getElementsByTagName('div');
    for (let i = 0; i < divs.length; i++) {
        alert(divs[i]);
    }



    // 1.3获取元素-根据name属性获取
    var ins = document.getElementsByName('hobby');
    for (let i = 0; i < ins.length; i++) {
        alert(ins[i]);
    }

    // 1.4获取元素-根据class属性获取
    var divs = document.getElementsByClassName('cls');
    for (let i = 0; i < divs.length; i++) {
        alert(divs[i]);
    }


</script>