JQuery学习之--3、jQuery对象和DOM对象

来源：互联网发布：c语言求和函数编辑：程序博客网时间：2024/05/22 08:19
1，DOM对象     DOM（Document Object Model ,文档对象模型，每一个DOM都可以表示成一个倒挂的树。）     <h3>例子</h3>     <p title="选择你喜欢的水果:">你喜欢的水果是?</p>     <ul>           <li>苹果</li>           <li>梨子</li>     </ul>    在DOM树中，<h3><p>等节点都是DOM元素的节点。    在javascript中，通过getElementById或者getElementTagName来获取元素的节点。像这样得到的元素就是DOM      对象:var objectDOM=document.getElemetById("id");//根据id获取DOM对象。 2，jQuery对象      jQuery对象就是通过jQuery包装DOM对象后产生的对象。      jQuery对象是jQuery独有的。如果一个对象是jQuery对象，那么他就可以使用jQuery中所有的方法。      $("#foo").html();//获取id为foo元素内的html代码,其中，html(),是jQuery中的方法。      上面的代码在DOM的写法:getElementById("foo").innerHTML;值得注意的是:在jQuery对象中，无法使用DOM对象的任何方法。同样的是，在DOM中也无法使用jQuery对象。特别注意的是:使用#id取得的jQUery对象，并非document.getelementById("id")得到的DOM对象，两者并不等价。3，jQUery对象和DOM对象的相互转换。     a，jQUery对象转换成DOM对象。          （1）jQuery对象是一个数组对象，可以通过[index]的方法得到相应的DOM对象。                   var $cr=$("#cr");//jQuery对象                   var cr  =$cr[0];//DOM对象          （2）另一种方法是jQUery本身提供的，通过get(index)方法得到相应的DOM对象。                   var $cr = $("#cr");//jQuery对象                   var cr=$cr.get(0);//DOM对象     b，DOM对象转换成jQUery对象。           对于一个DOM对象，只要用$()把DOM对象包装起来就可以获得jQUery对象。           var cr = document.getelementById("id");//获取的是DOM对象。           var $cr=$(cr);//转换成jQUery对象。小demo：<title>同意注册</title><script type="text/javascript" src="jquery-1.7.js"></script><script type="text/javascript">    $(function (){     var $foo=$("#foo");//获取到jQUery对象 var foo=$foo.get(0);//将jQuery对象转换成DOM对象 $foo.click(function (){      if(foo.checked){      alert("感谢您对我们的支持!");  } });});</script></head><body><input type="checkbox" id="foo"><label for="cr">同意上述内容</label></body>