欢迎来到天天文库
浏览记录
ID：40949909
大小：104.50 KB
页数：21页
时间：2019-08-11
《详解jQuery选择器与dom对象区别与应用技术》由会员上传分享，免费在线阅读，更多相关内容在行业资料-天天文库。
1、详解jQuery选择器与dom对象区别与应用技术编写任何javascript程序我们要首先获得对象，jQuery选择器能彻底改变我们平时获取对象的方式，可以获取几乎任何语意的对象，比如“拥有title属性并且值中包含test的元素”，完成这些工作只需要编写一个jQuery选择器字符串。无论是在写程序还是看API文档，我们要时刻注意区分Dom对象和jQuery包装集。Dom对象概述在传统的javascript开发中,我们都是首先获取Dom对象，比如：vardiv=document.getElementById
2、("testDiv");vardivs=document.getElementsByTagName("div");我们经常使用document.getElementById方法根据id获取单个Dom对象，或者使用document.getElementsByTagName方法根据HTML标签名称获取Dom对象集合。另外在事件函数中，可以通过在方法函数中使用this引用事件触发对象(但是在多播事件函数中IE6存在问题)，或者使用event对象的target(FF)或srcElement(IE6)获取到引发事件的Dom
3、对象。注意我们这里获取到的都是Dom对象，Dom对象也有不同的类型比如input、div、span等。Dom对象只有有限的属性和方法：jQuery包装集jQuery包装集可以说是Dom对象的扩充。在jQuery的世界中将所有的对象，无论是一个还是一组，都封装成一个jQuery包装集，比如获取包含一个元素的jQuery包装集：varjQueryObject=$("#testDiv");jQuery包装集都是作为一个对象一起调用的，jQuery包装集拥有丰富的属性和方法，这些都是jQuery特有的：Dom对象与jQu
4、ery对象的转换1）Dom转jQuery包装集如果要使用jQuery提供的函数，就要首先构造jQuery包装集。我们可以使用本文即将介绍的jQuery选择器直接构造jQuery包装集，比如：$("#testDiv");上面语句构造的包装集只含有一个id是testDiv的元素。或者我们已经获取了一个Dom元素，比如：vardiv=document.getElementById("testDiv");上面的代码中div是一个Dom元素，我们可以将Dom元素转换成jQuery包装集：vardomToJQueryObje
5、ct=$(div);2）jQuery包装集转Dom对象jQuery包装集是一个集合，所以我们可以通过索引器访问其中的某一个元素：vardomObject=$("#testDiv")[0];注意，通过索引器返回的不再是jQuery包装集,而是一个Dom对象！jQuery包装集的某些遍历方法，比如each()中，可以传递遍历函数，在遍历函数中的this也是Dom元素，比如：$("#testDiv").each(function(){alert(this)})如果我们要使用jQuery的方法操作Dom对象,怎么办?用上
6、面介绍过的转换方法即可：$("#testDiv").each(function(){$(this).html("修改内容")})知道了DOM对象与jQuery之间的区别，我们就可以这样在遍历中运用自如：varmydiv=$("div");for(vari=0;iDIV
7、SPAN
P
8、ss"jQuery代码：$(".myClass");结果：[divclass="myClass"
此文档下载收益归作者所有
