JQuery基础的一些解释

1.调用方法时要注意： 调用方法时要注意操作的是dom对象还是jquery对象。

普通的dom对象一般可以通过$()转换成jquery对象。

如：$(document.getElementById("msg"))则为jquery对象，可以使用jquery的方法。

由于jquery对象本身是一个集合(返回的对象为jquery对象（集合对象），不能直接调用dom定义的方法），所以如果jquery对象要转换为dom对象则必须取出其中的某一项，一般可通过索引取出。

如：$("#msg")[0]，$("div").eq(1)[0]，$("div").get()[1]，$("td")[5]这些都是dom对象， 其中$(exp).get(0)等效于$(exp)[0]。

可以使用dom中的方法，但不能再使用Jquery的方法。
以下几种写法都是正确的：

$("#msg").html(); $("#msg")[0].innerHTML;
（经常新手会$("#msg")[0].html(),当然这是错误的写法。）

$("#msg").eq(0)[0].innerHTML;$("#msg").get(0).innerHTML;
要注意，eq返回的是jquery对象，而get(n)和索引返回的是dom元素对象。

---

2，同一函数实现set和get: Jquery中的很多方法都是如此，主要包括如下几个：

$("#msg").html(); //返回id为msg的元素节点的html内容
$("#msg").html("new content"); //将“new content”作为html串写入id为msg的元素节点内容中,页面显示粗体的new content
$("#msg").text(); //返回id为msg的元素节点的文本内容
$("#msg").text("new content"); //将“new content” 作为普通文本串写入id为msg的元素节点内容中,页面显示new content
$("#msg").height(); //返回id为msg的元素的高度
$("#msg").height("300"); //将id为msg的元素的高度设为300
$("#msg").width(); //返回id为msg的元素的宽度
$("#msg").width("300"); //将id为msg的元素的宽度设为300
$("input").val("); //返回表单输入框的value值
$("input").val("test"); //将表单输入框的value值设为test
$("#msg").click(); //触发id为msg的元素的单击事件
$("#msg").click(fn); //为id为msg的元素单击事件添加函数，同样blur,focus,select,submit事件都可以有着两种调用方法
$("#msg").css("background"); //返回元素的背景颜色
$("#msg").css("background","#ccc"); //设定元素背景为灰色
$("#msg").css({ color: "red", background: "blue" }); //以名值对的形式设定样式
$("p").bind("click", function(){alert($(this).text());}); //为每个p元素添加单击事件
$("p").unbind(); //删除所有p元素上的所有事件
$("p").unbind("click") ; //删除所有p元素上的单击事件

---

3.集合处理功能
$("tr").each(function(i){this.style.backgroundColor=['#ccc','#fff'][i%2]}) //实现表格的隔行换色效果

$("p").click(function(i){this.style.color=['#f00','#0f0','#00f'][i]}) //为三个不同的p元素单击事件分别设定不同的处理