JQueryチュートリアル---DOM操作(一)

DOM操作
を例にとると、
元のjavascriptでは
var o=document.getElementById('a')で取得したidはaのノードオブジェクトであり、o.srcでそのノードのscr属性を取得または変更し、
jQueryでは
$("#a")jQueryオブジェクトが得られる[]
そしてjQueryが提供する多くの方法で操作することができ、
次のようになります.
$("#a").scr()は5を得る.jpg,
$("#a").scr(「1.jpg」)このオブジェクトのsrc属性を1に変更します.jpg.
次に、jQueryが提供する多くのjQueryメソッドについて説明します.DOMオブジェクトを迅速に操作するのに便利です.
1.herf()　 herf(val)
説明:jQueryオブジェクト属性herfの操作.
例:
jQueryが実行されない前

<a href="1.htm" id="test" onClick="jq()">jQuery</a>

jQueryコードおよび機能:

function jq(){
　alert($("#test").href());
　$("#test").href("2.html");
}

実行:idがtestの接続urlをポップアップダイアログボックスに表示し、urlを2に変更します.html、ポップアップダイアログボックスが表示されると、
同じように、jQueryは似たような他の方法を提供しています.それぞれ試してみてください.

herf()　herf(val)　

html()　html(val)　

id()　id (val)　

name()　name (val)　

rel()　rel (val)

src()　　src (val)　

title()　title (val)　

val()　val(val)

2. after(html) 　
説明:要素に一致した後にhtmlを挿入します.
例:
jQueryが実行されない前

<a href="http://p5s8.ddvip.com/index.php#" id="test" onClick="jq()">jQuery</a>

jQueryコードおよび機能:

function jq(){
　　　 $("#test").after("<b>Hello</b>");
}

実行後は次のようになります.

<a href="http://p5s8.ddvip.com/index.php#" id="test" onClick="jq()">jQuery</a><b>Hello</b>

3. after(elem)　after(elems)
説明:指定したオブジェクトelemまたはオブジェクトグループelemsを一致する要素に挿入します.
例:
jQueryが実行されない前

<p id="test">after</p><a href="http://p5s8.ddvip.com/index.php#" onClick="jq()">jQuery</a>

jQueryコードおよび機能

function jq(){
　　$("a").after($("#test"));
}

実行後は

<a href="http://p5s8.ddvip.com/index.php#" onClick="jq()">jQuery</a><pid="test">after</p>

4. append(html)
説明:一致する要素の内部に、指定したhtmlを挿入します.
例:
jQueryが実行されない前

<a href="http://p5s8.ddvip.com/index.php#" id="test" onClick="jq()">jQuery</a>

jQueryコードおよび機能:

function jq(){
　　$("#test").append("<b>Hello</b>");
}

実行後は

<a href="http://p5s8.ddvip.com/index.php#" onClick="jq()">jQuery<b>Hello</b></a>

同じ理屈で

append(elem)　append(elems)

before(html) before(elem) before(elems)

appendとafterを参照してテスト、理解を実行してください!
5.appendTo(expr)　
説明:append(elem)とは逆
例:
jQueryが実行されない前

<p id="test">after</p> 

<a href="http://p5s8.ddvip.com/index.php#" id="test" onClick="jq()">jQuery</a>

jQueryコードおよび機能

function jq(){
　　　$("a").appendTo($("#test"));
}

実行後は

<p id="test">after<a href="http://p5s8.ddvip.com/index.php#" onClick="jq()">jQuery</a></p>