JQuery技术总结(技术篇)
JQuery技术总结(初级技术篇)
技术方面
$(document).ready(function(){
// 程序段
})
该段代码类似于传统的 JavaScript 代码:
window.onload=function(){
// 程序段
}
虽然上述两段代码在功能上可以互换,但它们之间又有许多区别:
执行时间不同:$(document).ready 在页面框架下载完毕后就执行; window.onload 必须在页面全部加载完毕(包含图片下载)后才能执行。很明显,前者的执行效率高于后者。
执行数量不同: $(document).ready 可以重复写多个,并且每次执行结果不同; window.onload 尽管可以执行多个,但仅输出最后一个执行结果,无法完成多个结果的输出。
$(document).ready(function(){}) 可以简写成 $(function(){})
jQuery 程序的代码风格
1. $”美元符的使用
在 jQuery 程序中,使用最多的莫过于“$”美元符了,无论是页面元素的选择、功能函数的前缀,都必须使用该符号,可以说它是 jQuery 程序的标志。
2. 事件操作链接式书写
在编写页面某元素事件时,jQuery 程序可以使用链接式的方式编写该元素的所有事件。
jQuery 访问 DOM 对象
1. 什么是 DOM 对象
DOM(Document Object Model,文本对象模型)的每一个页面都是一个 DOM 对象,通过传统的 JavaScript 方法访问页面中的元素,就是访问 DOM 对象。
什么是 jQuery 对象
在 jQuery 库中,通过本身自带的方法获取页面元素的对象,我们称之为 jQuery 对象;为了同样实现在 ID 为 "divOut" 的标记中显示 ID 为 "divTmp" 的标记内容,采用 jQuery 访问页面元素的方法,其实现的代码如下:
var tDiv=$("#divTmp"); // 获取 jQuery 对象
var oDiv=$("#divOut"); // 获取 jQuery 对象
var cDiv=tDiv.html(); // 获取 jQuery 对象中的内容
oDiv.html(cDiv); // 设置 jQuery 对象中的内容