1. 什么是 DOM?

DOM即是文档对象模型,也可以称为节点,字面意义不容易理解。
下面我们用例子来说明。

<html>
    <head>
        <meta charset="utf-8">
        <title>武汉长乐教育PHP培训</title>
    </head>
    <body>
        <h3></h3>
        <p>口碑最好的武汉PHP培训机构</p>
        <ul>
            <li>苹果</li>
            <li>橘子</li>
            <li>梨子</li>
        </ul>
    </body>
</html>

页面显示效果

武汉PHP教程DOM

武汉PHP教程DOM图

DOM树(把网页元素表示为DOM树

2. 如果获取DOM

有两种方法

  1. JavaScript 原生方法 javascript var domObj = document.getElementById("foo"); //取得DOM对象 var ObjHTML = domObj.innerHTML; //使用JavaScript中的属性-innerHTML
  2. jQuery 方法 javascript //下面这一行等同于上面原生javascript $("#foo").html(); //取得一个jQuery对象,并使用html()方法

3. jQuery 对象和 DOM 对象互相转换

  1. jQuery 对象转 DOM 对象

    var $cr = $("#cr");     //jQuery对象
    var cr = $cr[0];        //DOM对象
    var cr2 = $cr.get(0);   //DOM对象
    
  2. DOM 对象转 jQuery 对象

    var cr = document.getElementById("cr");    //DOM对象
    var $cr = $(cr);    //jQuery对象
    

已添加到喜欢了