jquery的一些小知识点

1、toggleClass(className,boolean) 方法

该方法通过boolean的值来判断，是向指定jquery元素中添加className类还是删除className类，若为true，则添加，若为false，则将元素中的现存的该类删除。

2、$.fn.html(function(index,html){})方法

当参数为function(){}时，与$.fn.html()不同，后者只是给出第一个通过选择器得到的列表中的第一个元素的html，而前者，则会遍历返回列表中所有元素的url

3、通过$选择符，所返回对象为一个jQuery包装集

4、fn.prepend方法

该方法中传入的参数可以为字符串类型，也可以为$选择器获取的对象。若为选择器获取的对象，则将获取的整个jquery包装集都添加到fn中。比如以下代码：

html：

   
"i am div"
"i am p1"
"i am p2"
  

js：

$(function(){
$("div").prepend($("p"));
})

运行以上代码后，

标签中的内容由

"i am div"

变为

"i am p1"

"i am p2"

"i am div"

5、fn.appendTo()方法以及end()方法的匹配列表变化情况

举个例子:

html代码：

"i am div1"
"i am div2"
"i am p1"

js代码：

$("p")

此时的匹配列表内容为

"i am p1"

$("p").appendTo("div")

此时的匹配列表为一个jquery包装集，包装集中为两个相同的p标签

"i am p1"

，

"i am p1"

$("p").appendTo("div").end()

此时通过end方法，将匹配列表恢复至上一次的列表内容，即一个标签时的内容，此时列表内容为一个p标签

"i am p1"

，如果更精确点，该p标签为第二个div即

"i am div2"

中的p标签

6、fn.css()方法

当fn.css()方法传入参数为键/值对时，官方文档给出的键类型为字符串，可实际上，经过我的验证，即使不可以写成字符串也能正常运行，比如，$("div").css({height:100,width:100})和$("div").css({“height”:100,“width”:100})的效果是一样的。另外，除了可以通过这种直接值属性组成的对象作为输入参数，还可以通过函数返回值属性组成的对象作为输入参数。比如：

$("div").click(function() {
    $(this).css({
      width: function(index, value) {
        return parseFloat(value) * 1.2;
      }, //此时width属性并非通过直接值赋值，而是通过函数的返回值
      height: function(index, value) {
        return parseFloat(value) * 1.2;
      }
    });
  });