Jquery-addClass、attr、html、toggleClass、text、val基本用法

@addClass( class )

// 在 <p> 節點裡加入class = "selected"

// 移除 : removeClass( class ).

$("p").addClass("selected")

@attr( name )

// 取得<img src="test"> 裡的src值

// before : <img src="test.jpg"/>

// Result : test.jpg

$("img").attr("src");

@attr( properties )

// 將<img> 加入 src="test.jpg" alt="Test Image"

// before : <img/>

// Result : <img src="test.jpg" alt="Test Image"/>

$("img").attr({ src: "test.jpg", alt: "Test Image" });

@attr( key, value )

// 指定物件 的 key 並 設定 value

// 將 <img> 加入 src = "test.jpg"

// before : <img/>

// Result : <img src="test.jpg" />

$("img").attr("src","test.jpg");

// 將 <input> 加入 value = "test.jpg"

// before : <input>

// Result : <input value="test.jpg">

$("input").attr("value","test.jpg");

@attr( key, fn )

// 在<img>裡加入 title

//title 值 則是用function 回傳

//Before: <img src="test.jpg" />

//Result: <img src="test.jpg" title="test.jpg" />

$("img").attr("title", function() { return this.src });

//Before : <img title="pic" /><img title="pic" /><img title="pic" />

//Result: <img title="pic1" /><img title="pic2" /><img title="pic3" />

$("img").attr("title", function(index) { return this.title + (++index); });

@html()

// 取得 <div> xxx </div> xxx <= 取得的東西

// Before : <div> xxx </div>

// Result : xxx

$("div").html()

@html( val )

// 改變 <div>xxx</div> 為 <div><b>new stuff</b></div>

// Before : <div> xxx </div>

// Result : <div><b>new stuff</b></div>

$("div").html("<b>new stuff</b>");

@removeAttr( name )

//移除<input disabled="disabled">

// Before : <input disabled="disabled"/>

// Result : <input/>

$("input").removeAttr("disabled")

@removeClass( class )

//移除 <p> 裡的 class

// Before : <p class="selected">Hello</p>

// Result : <p>Hello</p>

$("p").removeClass()

// Before : <p class="selected first">Hello</p>

// Result : <p class="first">Hello</p>

$("p").removeClass("selected")

// Before : <p class="highlight selected first">Hello</p>

// Result : <p class="first">Hello</p>

$("p").removeClass("selected highlight")

@text()

//取得 <p> 裡的字串

// Before : <p><b>Test</b> Paragraph.</p><p>Paraparagraph</p>

// Result : Test Paragraph.Paraparagraph

$("p").text();

@text( val )

//取代<p>內的字串

// Before : <p>Test Paragraph.</p>

// Result : <p><b>Some</b> new text.</p>

$("p").text("<b>Some</b> new text.");

// Before : <p>Test Paragraph.</p>

// Result : <p><b>Some</b> new text.</p>

$("p").text("<b>Some</b> new text.", true);

@toggleClass( class )

// 將<P>有 class="selected" 移除 , 如果<P>沒有 class="selected" 則加入

// Before : <p>Hello</p><p class="selected">Hello Again</p>

// Result : <p class="selected">Hello</p>, <p>Hello Again</p>

$("p").toggleClass("selected")

@val()

// 抓取 INPUT 的 VALUE值

// Before : <input type="text" value="some text"/>

// Result : "some text"

$("input").val();

@val( val )

// 將INPUT 的 VALUE 值 改變為指定

// Before : <input type="text" value="some text"/>

// Result : <input type="text" value="test"/>

$("input").val("test");

出處-->