预览加载中，请您耐心等待几秒...

jQuery入门教程(很不错).pdf

预览
1/10
2/10
3/10
4/10
5/10
6/10
7/10
8/10
9/10
10/10

亲，该文档总共20页，到这已经超出免费预览范围，如果喜欢就直接下载吧～

下载提示 文本预览

如果您无法下载资料，请参考说明：

1、部分资料下载需要金币，请确保您的账户上有足够的金币

2、已购买过的文档，再次下载不重复扣费

3、资料包下载后请先用软件解压，在使用对应软件打开

jQuery入门[1]－构造函数 http://thinhunan.cnblogs.com/archive/2008/03/05/1091816.htmljQuery优点 ◦体积小（v1.2.315kb） ◦丰富的DOM选择器(CSS1-3+XPath)◦跨浏览器（IE6,FF,Safari,Opera） ◦链式代码 ◦强大的事件、样式支持 ◦强大的AJAX功能 ◦易于扩展，插件丰富 jQuery的构造函数接收四种类型的参数： jQuery(expression,context) jQuery(html) jQuery(elements) jQuery(fn) 第一种根据表达式（ID，DOM元素名，CSS表达式，XPath表达式）找出文档中的元素， 并组装成一个jQuery对象返回。 DEMO: DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <htmlxmlns="http://www.w3.org/1999/xhtml"> <head> <title>jQuerybasictitle> <styletype="text/css"> .selected { background-color:Yellow; } style> <scriptsrc="../scripts/jquery-1.2.3.intellisense.js" type="text/javascript">script> head> <body> <h3>jQuery构造函数h3> <ul> <li>jQuery(expression,context)li> <li>jQuery(html)li> <li>jQuery(elements)li> <li>jQuery(fn)li> ul> <scripttype="text/javascript"> script> body> html> 将以下jQuery代码加入文末的脚本块中： jQuery("ul>li:first").addClass("selected"); 页面运行效果如下： 其中jQuery()可替换为快捷方式$()，如果$被其它对象占用，可使用jQuery.noConflict() 函数取消快捷方式。 "ul>li:first"中ul>li表示所有位于ul下的li元素（为CSS表达式，XPath方式可用 ul/li），:first表示其中的第一个。addClass()为jQuery对象用来添加CSS样式类的函数， 相反的函数为removeClass()。 再加入以下代码： $('ul').append($(' newitem')); 运行效果如下： 其中$(' newitem ')将其中的字符串转换为DOM对象，然后通过append()函数加入ul对象的最后。 接下来： $(document).ready(function(){ $('ul').css('color','red'); }); 则效果如： jQuery构造函数中还可以真接传入DOM对象，如document，或jQuery对象（当然就 没什么意义）。ready()函数为document添加事件处理函数，将ul的颜色设为红色。 $(document).ready()由于应用场景众多，所以可以直接用$(fn)来代替，fn表示处理函 数。（ready处理函数貌似在文档内容载入完成后执行，无需等待相关其它图片等资源载入 完成，所以比load事件要更早执行，对于这点，没有具体证实） $(function(){ alert('welcometojQuery'); }); 以上代码的效果是页面一载入，就弹出一个对话框。 jQuery1.2选择器 jQuery1.2选择器 以下的文档根据官网1.2选择器汉化，并做相应的调整及加入了部份示例。 由于实际使用中选择器在IE和非IE下会有不同的效果，请参照红色的字样。如有错误请 及时联系我。 绯雨汉化：http://feiyu.asgard.cn/http://feiyu.asgard.cn 基本选择器 #myid返回:对象> 匹配一个id为myid的元素。 element返回:对象>数组 匹配所有的element元素 .myclass返回:对象>数组 匹配所有class为myclass的元素 *返回:对象>数组 匹配所有元素。该选择器会选择文档中所有的元素，包括html， head，body selector1,selector2,selectorN返回:对象>数组