jQueryセレクター
jQuery セレクター
jQuery セレクターを使用すると、HTML 要素のグループまたは個(gè)々の要素を操作できます。
jQuery セレクター
jQuery セレクターを使用すると、HTML 要素のグループまたは個(gè)々の要素を操作できます。
jQuery セレクターは、要素の ID、クラス、タイプ、屬性、屬性値などに基づいて HTML 要素を「検索」(または選択) します。 これは、いくつかのカスタム セレクターに加えて、既存の CSS セレクターに基づいています。
jQuery のすべてのセレクターはドル記號(hào) $() で始まります。
要素セレクター
jQuery 要素セレクターは、名前に基づいて要素を選択します。
ページ內(nèi)のすべての <p> 要素を選択します:
$("p")
例
ユーザーがボタンをクリックすると、すべての <p> 要素が非表示になります:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>jQuery示例</title>
<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js">
</script>
<script>
$(document).ready(function(){
$("button").click(function(){
$("p").hide();
});
});
</script>
</head>
<body>
<h2>這是一個(gè)標(biāo)題</h2>
<p>這是一個(gè)段落。</p>
<p>這是另一個(gè)段落。</p>
<button>點(diǎn)我</button>
</body>
</html>#id セレクター
jQuery #id セレクターは、HTML 要素の id 屬性を通じて指定された要素を選択します。 ページ上の要素の ID は一意である必要があるため、ページ上で一意の要素を選択したい場(chǎng)合は、#id セレクターを使用する必要があります。 ID で要素を選択するための構(gòu)文は次のとおりです: $("#test")<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js">
</script>
<script>
$(document).ready(function(){
$("button").click(function(){
$("#test").hide();
});
});
</script>
</head>
<body>
<h2>好好學(xué)習(xí)</h2>
<p>天天向上</p>
<p id="test">PHP測(cè)試</p>
<button>點(diǎn)我</button>
</body>
</html>.class selector
jQuery クラス セレクターは、指定されたクラスで要素を検索できます。 文法は次のとおりです: ($ (". Test") 文法説明
("*") すべての要素を選択 $ (this) 現(xiàn)在の HTML 要素を選択 $ ("" " p.intro") クラスのイントロを持つ <p> 要素を選択します。
$("p:first")最初の要素を選択します("ul li:first-child") 各
- 要素の最初の
- 要素を選択します
$("[href] ") href 屬性を持つ要素を選択します
$("a [target='_blank']") target 屬性値が "_blank" に等しい <a> 要素をすべて選択します
$("a[target! ='_blank']") "_blank" & Lt; a & gt; 要素
$(": Button") すべて選択 type = "Button" & lt; input と等しくない対象の屬性値をすべて選択します& gt; 要素と & lt; ボタン & gt; 要素
("tr: ODD") 要素を選択します。
jQuery 関數(shù)の使用Web サイトに多くのページが含まれており、jQuery 関數(shù)のメンテナンスが簡(jiǎn)単であることを希望する場(chǎng)合は、jQuery 関數(shù)を別の .js ファイルに入れてください。
チュートリアルで jQuery を説明するときは、関數(shù)を <head> セクションに直接追加します。ただし、次のように、それらを別のファイルに置く方がよいでしょう (src 屬性を介してファイルを參照します):
<head> <script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js"> </script> <script src="my_jquery_functions.js"></script> </head>
