您的位置：首页 > Web前端 > JQuery

jquery选择器

2016-05-19 10:03 477 查看
<!--

jquery选择器

1.jquery元素选择器

jQuery 使用 CSS 选择器来选取 HTML 元素。

$("p") 选取 <p> 元素。

$("p.intro") 选取所有 class="intro" 的 <p> 元素。

$("p#demo") 选取所有 id="demo" 的 <p> 元素。

2.jquery属性选择器

jQuery 使用 XPath 表达式来选择带有给定属性的元素。

$("[href]") 选取所有带有 href 属性的元素。

$("[href='#']") 选取所有带有 href 值等于 "#" 的元素。

$("[href!='#']") 选取所有带有 href 值不等于 "#" 的元素。

$("[href$='.jpg']") 选取所有 href 值以 ".jpg" 结尾的元素。

3.jQuery CSS 选择器

jQuery CSS 选择器可用于改变 HTML 元素的 CSS 属性。

下面的例子把所有 p 元素的背景颜色更改为红色：

-->

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>选择器</title>

<script src="jquerylib/jquery-1.12.3.js"></script>

<script>

$(document).ready(function(){

$("input").click(function(){

$("p").css("background-color","red");

});

});

</script>

</head>

<body>

<h1>改变p元素的背景颜色</h1>

<p>这是第一个段落</p>

<p>这是第二个段落</p>

<input type="button" value="改变背景颜色" />

</body>

</html>

<!--

更多的选择器实例：

语法 描述

$(this) 当前 HTML 元素

$("p") 所有 <p> 元素

$("p.intro") 所有 class="intro" 的 <p> 元素

$(".intro") 所有 class="intro" 的元素

$("#intro") id="intro" 的元素

$("ul li:first") 每个 <ul> 的第一个 <li> 元素

$("[href$='.jpg']") 所有带有以 ".jpg" 结尾的属性值的 href 属性

$("div#intro .head") id="intro" 的 <div> 元素中的所有 class="head" 的元素

-->
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息
标签： 
相关文章推荐
新的分享
章节导航