Fork me on GitHub

DOM对象与jQuery对象

什么是DOM？

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

  1. <html>
  2. <head>
  3. <meta charset="utf-8">
  4. <title>武汉长乐教育PHP培训</title>
  5. </head>
  6. <body>
  7. <h3></h3>
  8. <p>口碑最好的武汉PHP培训机构</p>
  9. <ul>
  10. <li>苹果</li>
  11. <li>橘子</li>
  12. <li>梨子</li>
  13. </ul>
  14. </body>
  15. </html>

页面显示效果

武汉PHP教程DOM

武汉PHP教程DOM图

DOM树（把网页元素表示为DOM树）

如果获取DOM？

有两种方法

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

jQuery对象和DOM对象互相转换

    1. jQuery对象转DOM对象

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

    2. DOM对象转jQuery对象

      1. var cr = document.getElementById("cr"); //DOM对象
      2. var $cr = $(cr); //jQuery对象
posted @ 2018-10-25 14:07  big2cat  阅读(152)  评论(0)    收藏  举报