jQuery对象和jQuery对象的转换与分析
本文分析了DOM对象和jQuery对象之间的转换和区别,供大家参考,具体分析如下:Hello World程序:
jQuery的引入。有两个版本,jquery-x.y.z.min.js是一个紧凑的版本,不分是一个开发版本,和代码中的注释和压痕都保留。
请注意,使用了逃逸的路径。
$()符号将DOM对象转换为jQuery对象。
Hello World程序如下:
复制代码代码如下所示:
你好,jQuery
$(文档)Ready(函数(){)
警报(Hello World);
});
$(document)比较好,在window.onload。
先看看在window.onload:
复制代码如下:在window.onload =打招呼;
在window.onload =表示世界;
函数sayHello(){
警报(hello);
}
函数表示世界(){
警报(世界);
}
后一种方法将覆盖以前的方法,也就是说,泡沫最终显示出一个,那就是世界。
如果使用$(文档),则该方法将串联连接,即首先显示hello的警报,然后显示该世界。
复制代码代码如下:$(document)准备(打招呼);
$(document)准备(表示世界);
函数sayHello(){
警报(hello);
}
函数表示世界(){
警报(世界);
}
通过这种方式,可以关联多种方法。
另一个不同的是,准备执行方法会一点点接近最后一点.. widow.onload等待DOM准备好,和所有的结合端,而准备只能DOM就绪,剩下的工作可能还没有准备好。
例如:添加onclick事件每个链接对象
首先,一些超链接的对象添加到身体:
复制代码代码如下所示:
test1
test2
试验
4
还有一些添加onclick事件到每个对象的方法:
首先,你可以在每一个标签写onclick属性。
其次,你可以使用在window.onload添加一个方法来获得所有的标签和添加事件,如下:
复制代码如下:在window.onload =函数(){()
无功mylinks = document.getelementsbytagname();
对于(var i = 0;i < mylinks.length;+ +我){
我mylinks { }。onclick =函数(){
警报(链接+ i);
}
}
}
请注意,我在这里犯了一个错误,我认为警报的数量将会增加,实际操作的结果是每一次警报都是4次。
这是因为js没有块级作用域。变量i指的是。循环后,变成4。也就是说,当事件发生时,我的价值会牵强,当然,这将是4。
以下是用jQuery实现的:
复制代码如下:$(文档)Ready(函数(){(){)
$()。Click(函数(){)
从jQuery中发出hello链接!;
});
});
jQuery中的$()符号获取页面中的所有适当元素。
因此上面的代码意味着遍历过程,向每个元素添加一个事件处理函数。
单击方法是jQuery对象提供的方法。
Onclick是DOM对象的属性。
DOM中的许多属性都变成了一种方法。
DOM对象和jQuery对象之间的转换和区别
举个例子,首先,添加一个p标记:
复制代码如下:单击我!
首先,获取一个DOM对象,然后将其转换为jQuery对象:
将代码复制如下:1
DOM对象:
var pElement = document.getelementsbytagname(P){ 0 };
警报(DOM pElement:+ pElement .innerHTML);
将DOM对象转换为jQuery对象:
无功pelementjquery = $(pElement);
警报(jQuery pelementjquery:+ pelementjquery.html());
您还可以获得jQuery对象,然后将其转换为DOM对象:
将代码复制如下:2
jQuery对象数组:
无功clickmejquery = $(# clickme );
将jQuery对象转换为DOM对象(2种方式):
1:
无功domclickme1 = clickmejquery { 0 };
警报(DOM1:+ domclickme1 .innerHTML);
2:
无功domclickme2 = clickmejquery.get(0);
警报(DOM2:+ domclickme2 .innerHTML);
注意:在jQuery中,$()是满足条件的所有元素的数组。
小总结:
$()字符串返回满足条件的所有元素的数组,其中:
字符串#开始,我说;
字符串以CSS的类名开始;
如果不是在上述两种情况下,则将字符串更改为表示标签名称。
$(DOM对象)可以获得jQuery对象。
希望本文能对大家的jQuery程序设计有所帮助。