jQuery用法笔记

二、学习教程及参考资料
请参照《jQuery中文API手册》和http://jquery.org.cn/visual/cn/index.xml
推荐两篇不错的jquery教程:《jQuery的起点教程》和《使用 jQuery 简化 Ajax 开发》(说明:以上文档都放在了【附件】中)三、语法总结和注意事项1、关于页面元素的引用通过jquery的$()引用元素包括通过id、class、元素名以及元素的层级关系及dom或者xpath条件等方法,且返回的对象jquery对象(集合对象),不能直接调用dom定义的方法。如:
$("#msg").html();-->通过ID $("div").html(); $("input").val(); -->通过元素名(jQuery获取的是一个集合) $("div p"); -->第一行代码得到所有<div>标签下的<p>元素。 $("div.container") -->第二行代码得到 class为container的<div>元素 $("div #msg"); -->第三行代码得到<div>标签下面id为msg的元素。 $("table a",context); -->第四行代码得到context为上下文的table里面所有的连接元素。
2、jQuery对象与dom对象的相互转换2.1只有jquery对象才能使用jquery定义的方法。注意dom对象jquery对象是有区别的,普通的dom对象一般可以通过$()转换成jquery对象如:$(document.getElementById("msg"))则为jquery对象,可以使用jquery的方法。
2.2由于jquery对象本身是一个集合。所以如果jquery对象要转换为dom对象则必须取出其中的某一项,一般可通过索引取出。如:$("#msg")[0],$("div").eq(1)[0],$("div").get()[1],$("td")[5]这些都是dom对象,可以使用dom中的方法,但不能再使用Jquery的方法。
以下几种写法都是正确的:
$("#msg").html(); $("#msg")[0].innerHTML; $("#msg").eq(0)[0].innerHTML; $("#msg").get(0).innerHTML;
对于获取的元素集合,获取其中的某一项(通过索引指定)可以使用eq或get(n)方法或者索引号获取,要注意,eq返回的是jquery对象,而 get(n)和索引返回的是dom元素对象如要获取第三个 <div>元素的内容。有如下两种方法:
$("div").eq(2).html(); //调用jquery对象的方法 $("div").get(2).innerHTML; //调用dom的方法属性
3、同一函数实现set和getJquery中的很多方法都是如此,主要包括如下几个:
$("#msg").html(); //返回id为msg的元素节点的html内容。 $("#msg").html("<b>new content</b>"); //将“<b>new content</b>” 作为html串写入id为msg的元素节点内容中,页面显示粗体的new content $("#msg").text(); //返回id为msg的元素节点的文本内容。 $("#msg").text("<b>new content</b>"); //将“<b>new content</b>” 作为普通文本串写入id为msg的元素节点内容中,页面显示<b>new content</b> $("#msg").height(); //返回id为msg的元素的高度 $("#msg").height("300"); //将id为msg的元素的高度设为300 $("#msg").width(); //返回id为msg的元素的宽度 $("#msg").width("300"); //将id为msg的元素的宽度设为300 $("input").val("); width:300px;height:400px;" JSON将Action里的状态信息序列化成JSON格式的数据
Tags: 

延伸阅读

最新评论

发表评论