jQuery 核心

1.jQuery选择器获得html

//css 选择器
$() ;

//$("p") 选取 <p> 元素。
//$("p.intro") 选取所有 class="intro" 的 <p> 元素。

 2.动态创建html

//通过append,appendto,prepend,prependto等方法添加到指定的对象中
$("<div>", {
  "class": "test",
  text: "Click me!",
  click: function(){
    $(this).toggleClass("test");
  }
}).appendTo("body");

3. 预加载     jQuery(callback)

//$(document).ready()的简写
$(function(){
    //code
});

 4. 暂停或恢复.ready() 事件的执行。     jQuery.holdReady(hold)

//延迟就绪事件,直到已加载的插件。
$.holdReady(true);
$.getScript("myplugin.js", function() {
     $.holdReady(false);
});

5. each  

/*以每一个匹配的元素作为上下文来执行一个函数。
语法 $(selector).each(function(index,element))
index - 选择器的 index 位置
 element - 当前的元素(也可使用 "this" 选择器) 
*/
$("img").each(function(i){
   this.src = "test" + i + ".jpg";
 });

 6. size

//jQuery 对象中元素的个数。

7. length

  区别

1.length是属性,size()是方法。
2.如果你只是想获取元素的个数,两者效果一样既 $("img").length 和 $("img").size() 获取的值是一样的;但是如果是获取字符串的长度就只得用length, 如 $("#text").val().length。

而且在jquery 1.8后 length取代了 size()  ,因为length不需要返回一个函数调用,更优秀。

8. get         get([index])

//取得第 index 个位置上的元素
//$(this).get(0)与$(this)[0]等价。

9 index

//搜索匹配的元素,并返回相应元素的索引值,从0开始计数。
//如果找到了匹配的元素,从0开始返回;如果没有找到匹配的元素,返回-1。
HTML 代码: <ul> <li id="foo">foo</li> <li id="bar">bar</li> <li id="baz">baz</li> </ul> jQuery 代码: $('li').index(document.getElementById('bar')); //1,传递一个DOM对象,返回这个对象在原先集合中的索引位置 $('li').index($('#bar')); //1,传递一个jQuery对象 $('li').index($('li:gt(0)')); //1,传递一组jQuery对象,返回这个对象中第一个元素在原先集合中的索引位置 $('#bar').index('li'); //1,传递一个选择器,返回#bar在所有li中的做引位置 $('#bar').index(); //1,不传递参数,返回这个元素在同辈中的索引位置。

10. data       data([key],[value])

/*
key:存储的数据名
value:将要存储的任意数据
*/
HTML 代码:
<div></div>
jQuery 代码:
$("div").data("test", { first: 16, last: "pizza!" });
$("div").data("test").first  //16;
$("div").data("test").last  //pizza!;

11. removeData         

//从元素中删除之前添加的数据:
jQuery 代码:
$("#btn2").click(function(){
  $("div").removeData("greeting");
  alert("Greeting is: " + $("div").data("greeting"));
});

12. javascript 插件兼容 

var j = jQuery.noConflict();

 

 

posted @ 2014-07-05 01:23  swinm  阅读(139)  评论(0)    收藏  举报