jQuery Core 筆記 @ 飛翔部落 :: 痞客邦 PIXNET ::

Bookmark:

本篇文章內容是我在jquery官網看的說明文件的筆記

$( html ) //html code
說明: //在<body>裡加入一段 html code
例: $("<div><p>Hello</p></div>").appendTo("body")
說明: //在<body>裡加入<div><p>Hello</p></div>

$( elems ) // 節點
說明: //取得html 任一節點
例: $(document.body).css( "background", "black" );
說明: //將<body> 加入 css ("background", "black")

例: $( myForm.elements ).hide();
說明: // 將<form id="myForm"></form> 裡的所有物件隱藏

$( fn )
說明: //使用jQuerty
例:
$(function(){
   // Document is ready
});
jQuery(function($) {
   // Your code using failsafe $ alias here...
});
說明: //作用和 $(document).ready()一樣 ,寫法不一樣

$( expr, context )
例: $("input:radio", document.forms[0])
說明: //取得forme裡的所有為radio物件
例: $("div", xml.responseXML)
說明: //取得div 在xml回傳裡面的div

$.fn.extend( prop )
說明: //自己定義function
例:
jQuery.fn.extend({
   check: function() { // 自定義 check function
     return this.each(function() { this.checked = true; });
   },
   uncheck: function() { // 自定義 uncheck function
     return this.each(function() { this.checked = false; });
   }
});
$("input[@type=checkbox]").check(); // 將所有的 checkbox 改變為 已選擇
$("input[@type=radio]").uncheck(); // 將所有的 radio 改變為 未選擇

$.noConflict()
說明: //解決與其它 lib 衝突問題
例: jQuery.noConflict(); //解決衝突問題
說明: //同時使用jquery和prototype lib
jQuery("form input").hide(); // 將在form裡的input都隱藏
$("content").style.display = 'none'; // 使用prototype lib

each( fn )
說明: //取得某一類物件,用each取出
例:
$("img").each(function(i){
    this.src = "test" + i + ".jpg";
});
Before:
<img/><img/>
Result:
<img src="test0.jpg"/><img src="test1.jpg"/>
說明: //使用each 將<img> 加入 src位置

eq(pos)
說明: //將節點以陣列方式抓取值,
例: $("p").eq(1)
說明: //將節點 <p> 以陣列方式抓取值, eq(1) :抓取第1個<p>的值 ,從0開始計算
//alert($("p").eq(1).html());

get(pos)
$("p").get(0)
注意:
get和eq的區別，eq返回的是jQuery對象，get返回的是所匹配的dom對象，
所有取$("p").eq(1)對象的內容用jQuery方法html()，而取$("p").get(1)的內容用innerHTML

gt( os )
說明: //將節點以陣列方式抓取值,從後面開始抓值
例: $("p").get(0)
說明: //將節點 <p> 以陣列方式抓取值, 從後面開始算
//alert($("p").gt(0).html());

index( subject )
說明: //查尋物件ID值
例: $("*").index( $('#foobar')[0] )
說明:
// $("*").index <= 要查詢的物件 例如: div span 的 id 名
// $('#foobar')[0] <= #foobar 為查詢條件
// 查詢值 : -1=沒找到

length
說明: // 查詢物件的數量
例: $("img").length;
說明: // 取得<img>數量,img <= 要查詢的物件

lt( pos )
說明: // 抓取節點裡的字串
例: $("p").lt(1)
說明: // 抓取<p>節點裡的字串
// $("p")=>物件節點
// lt(1)=>該物件的第一個
// alert($("p").lt(1).html());

size()
說明: // 同LENGTH
例: $("img").size();
說明: // 查詢<img>物件的數量
// img <= 要查詢的物件

Posted by shian0745 at 痞客邦 PIXNET Comments(0) Trackback(0) Hits(984)