码迷,mamicode.com
首页 > Web开发 > 详细

JQuery入门(1) - 选择器

时间:2016-05-12 14:05:51      阅读:187      评论:0      收藏:0      [点我收藏+]

标签:

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”),可以测试不同的选择器语法。

JQuery入门(1) - 选择器

标签:

原文地址:http://blog.csdn.net/kenzhang1031/article/details/51362224

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!