jQuery对象和DOM对象【jQuery入门二】

jQuery对象和DOM对象;这是我第一个碰到的问题。

jQuery对象就是通过jQuery包装DOM对象后产生的对象。jQuery对象是jQuery独有的,其可以使用jQuery里的方法,但是不能使用DOM的方法;例如:

$(“#img”).attr(“src”,”test.jpg”); 这里的$(“#img”)就是获取jQuery对象;

DOM对象就是Javascript固有的一些对象操作。DOM对象能使用Javascript固有的方法,但是不能使用jQuery里的方法。例如:

document.getElementById(“img”).src=”test.jpg”;这里的document.getElementById(“img”)就是DOM对象;

$(“#img”).attr(“src”,”test.jpg”); 和document.getElementById(“img”).src=”test.jpg”;是等价的,是正确的但是$(“#img”).src=”test.jpg”;或者document.getElementById(“img”).attr(“src”,”test.jpg”); 都是错误的

再说一个例子:就是this,我在写jQuery的时候经常这样写:

this.attr(“src”,”test.jpg”);

可是就是出错。其实this是DOM对象,而

.attr(“src”,”test.jpg”)

是jQuery方法,所以出错了。要解决这个问题就要将DOM对象转换成jQuery对象,例如:

$(this).attr(“src”,”test.jpg”);

1.DOM对象转成jQuery对象:

对于已经是一个DOM对象,只需要用$()把DOM对象包装起来,就可以获得一个jQuery对象了。$(DOM对象)

如:var v=document.getElementById(“v”);? //DOM对象

var $v=$(v);??? //jQuery对象

转换后,就可以任意使用jQuery的方法了。

2.jQuery对象转成DOM对象:

两种转换方式将一个jQuery对象转换成DOM对象:[index]和.get(index);

(1)jQuery对象是一个数据对象,可以通过[index]的方法,来得到相应的DOM对象。

如:

var $v =$(“#v”) ; //jQuery对象

var v=$v[0];??? //DOM对象

alert(v.checked)?? //检测这个checkbox是否被选中

(2)jQuery本身提供,通过.get(index)方法,得到相应的DOM对象

如:var $v=$(“#v”);? //jQuery对象

var v=$v.get(0);?? //DOM对象

alert(v.checked)? //检测这个checkbox是否被选中

通过以上方法,可以任意的相互转换jQuery对象和DOM对象。需要再强调注意的是:DOM对象才能使用DOM中的方法,jQuery对象是不可以用DOM中的方法。

赞(0) 打赏
未经允许不得转载:WEB前端开发 » jQuery对象和DOM对象【jQuery入门二】

评论 1

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址
  1. #-49

    感谢分享,有点理解了

    ecren9年前 (2010-02-22)回复

前端开发相关广告投放 更专业 更精准

联系我们

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏