JQuery入门（1） - 选择器
$("元素") // 选取元素
$("元素.类名") // 选取元素中class为“类名”的元素
$("元素.#ID") // 选取元素中id="ID"的元素
$("[属性]") // 选取包含“属性”的所有元素
$("[属性]=‘值‘") // 选取属性等于‘值’的元素
$("[属性]!=‘值‘") // 选取属性不等于‘值’的元素
$("[属性]^=‘值‘") // 选取属性值以‘值’开头的元素
$("[属性]$=‘值‘") // 选取属性值以‘值’结尾的元素
举例
把test.html放到当前目录中，jquery.js放到目录./jquery/目录中。
test.html文件如下，为了一目了然，把自己写的javascript代码嵌入到html中：
<!-- test.html文件 -->
<html>
<head>
<script type="text/javascript" src="/jquery/jquery.js"></script>
</head>
<body>
<h2>测试选择器</h2>
<p id = ‘id1‘ class = ‘class1‘>第一行，元素p，id=‘id1‘，class=‘class1‘</p>
<p id = ‘id2‘ class = ‘class2‘>第二行，元素p，id=‘id2‘，class=‘class2‘</p>
<button type="button">执行选择器</button>
<script type="text/javascript">
$("button").click(function(){
$("p#id1").html("<p backgroud-color=‘red‘>执行原则器之后</p>") // 修改这里的 $("p#id1")，测试不同的选择器
.css("background-color","red");
});
</script>
</body>
</html>
例子是执行$(“p#id1”)选择器，点击按键后，id为id1的元素的文字变成了“执行原则器之后”，红色背景。通过修改 $(“p#id1”)，可以测试不同的选择器语法。
时间： 2024-11-05 22:50:38