jQuery 对象就是通过 jQuery 包装 DOM 对象后产生的对象, 它是 jQuery 独有的; jQuery 对象不能使用 Dom 对象的方法, Dom 对象不能使用 jQuery 对象的方法.
jQuery 对象就是通过 jQuery 包装 DOM 对象后产生的对象, 它是 jQuery 独有的. 如果一个对象是 jQuery 对象, 那么就可以使用 jQuery 里的方法, 例:
$("#foo").html(); // 获取 id 为 foo 的元素内的 HTML 代码
上例中, HTML()就是 jQuery 特有的方法.
上面的那段代码等同于:
document.getElementById("foo").innerHTML;
注意: 在 jQuery 对象中无法使用 DOM 对象的任何方法.
例如 $("#id").innerHTML 和 $("#id").checked 之类的写法都是错误的, 可以用 $("#id").HTML()和 $("#id").attr("checked")之类的 jQuery 方法来代替.
同样, DOM 对象也不能使用 jQuery 方法. 学习 jQuery 开始就应当树立正确的观念, 分清 jQuery 对象和 DOM 对象之间的区别, 之后学习 jQuery 就会轻松很多的.
jQuery 对象和 DOM 对象的互相转换
jQuery 对象和 dom 对象是不一样的! 比如 jQuery 对象不能使用 dom 的方法, dom 对象不能使用 jQuery 方法, 那假如我 jQuery 没有封装我要的方法, 那能怎么办呢?
这时我们可以将 jquer 对象转换成 dom 对象
jQuery 对象转换成 dom 对象
jQuery 提供了两种方法将一个 jQuery 对象转换成一个 dom 对象, 即 [index] 和 get(index). 可能有人会觉得奇怪, 怎么是用下标呢, 没错, jQuery 对象就是一个数组对象.
下面代码将演示一个 jQuery 对象转换成 dom 对象, 再使用 dom 对象的方法
代码如下:
- var $cr=$("#cr"); //jQuery 对象
- var cr = $cr[0]; //dom 对象 也可写成 var cr=$cr.get(0);
- alert(cr.checked); // 检测这个 checkbox 是否给选中
dom 对象转换成 jQuery 对象
对于一个 dom 对象, 只需要用 $()把 dom 对象包装起来, 就可以获得一个 jQuery 对象了, 方法为 $(dom 对象);
代码如下:
- var cr=document.getElementById("cr"); //dom 对象
- var $cr = $(cr); // 转换成 jQuery 对象
转换后可以任意使用 jQuery 中的方法了.
通过以上的方法, 可以任意的相互转换 jQuery 对象和 dom 对象.
最后再次强调, dom 对象才能使用 dom 中的方法, jQuery 对象不可以使用 dom 中的方法, 但 jQuery 对象提供了一套更加完善的工具用于操作 dom, 关于 jQuery 的 dom 操作将在后面的文章进行详细讲解.
ps: 平时用到的 jQuery 对象都是通过 $()函数制造出来的,$()函数就是一个 jQuery 对象的制造工厂.
建议: 如果获取的对象是 jQuery 对象, 那么在变量前面加上 $, 这样方便容易识别出哪些是 jQuery 对象, 例如:
var $variable = jQuery 对象;
如果获取的是 dom 对象, 则定义如下:
var variable = dom 对象
更多 web 前端开发 https://www.html.cn/ 知识, 请查阅 HTML 中文网 !!
来源: http://www.css88.com/qa/jquery/17078.html