博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
jQuery 选择器
阅读量:3934 次
发布时间:2019-05-23

本文共 2146 字,大约阅读时间需要 7 分钟。

 

jQuery 元素选择器

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

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

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

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

jQuery 属性选择器

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

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

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

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

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

jQuery CSS 选择器

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

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

实例:

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

 

更多的选择器实例

语法 描述
$(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" 的元素

 

jQuery 选择器

选择器 实例 选取
$("*") 所有元素
$("#lastname") id="lastname" 的元素
$(".intro") 所有 class="intro" 的元素
$("p") 所有 <p> 元素
.class.class $(".intro.demo") 所有 class="intro" 且 class="demo" 的元素
     
$("p:first") 第一个 <p> 元素
$("p:last") 最后一个 <p> 元素
$("tr:even") 所有偶数 <tr> 元素
$("tr:odd") 所有奇数 <tr> 元素
     
$("ul li:eq(3)") 列表中的第四个元素(index 从 0 开始)
$("ul li:gt(3)") 列出 index 大于 3 的元素
$("ul li:lt(3)") 列出 index 小于 3 的元素
:not(selector) $("input:not(:empty)") 所有不为空的 input 元素
     
$(":header") 所有标题元素 <h1> - <h6>
  所有动画元素
     
$(":contains('W3School')") 包含指定字符串的所有元素
$(":empty") 无子(元素)节点的所有元素
:hidden $("p:hidden") 所有隐藏的 <p> 元素
$("table:visible") 所有可见的表格
     
s1,s2,s3 $("th,td,.intro") 所有带有匹配选择的元素
     
$("[href]") 所有带有 href 属性的元素
$("[href='#']") 所有 href 属性的值等于 "#" 的元素
$("[href!='#']") 所有 href 属性的值不等于 "#" 的元素
$("[href$='.jpg']") 所有 href 属性的值包含以 ".jpg" 结尾的元素
     
$(":input") 所有 <input> 元素
$(":text") 所有 type="text" 的 <input> 元素
$(":password") 所有 type="password" 的 <input> 元素
$(":radio") 所有 type="radio" 的 <input> 元素
$(":checkbox") 所有 type="checkbox" 的 <input> 元素
$(":submit") 所有 type="submit" 的 <input> 元素
$(":reset") 所有 type="reset" 的 <input> 元素
$(":button") 所有 type="button" 的 <input> 元素
$(":image") 所有 type="image" 的 <input> 元素
$(":file") 所有 type="file" 的 <input> 元素
     
$(":enabled") 所有激活的 input 元素
$(":disabled") 所有禁用的 input 元素
$(":selected") 所有被选取的 input 元素
$(":checked") 所有被选中的 input 元素

 

 
 
 
 
 
 
 
posted @ 2019-03-26 23:53 阅读(...) 评论(...)

转载地址:http://uahgn.baihongyu.com/

你可能感兴趣的文章
1分钟学会用git管理代码
查看>>
git服务端配置
查看>>
印刷工艺- 喷墨印刷
查看>>
纸张大小、规格、度量详解
查看>>
常用纸张规格介绍
查看>>
印刷工艺流程
查看>>
印刷业ERP启蒙
查看>>
如何正确实施印刷业ERP(二)
查看>>
如何正确实施印刷业ERP(一)
查看>>
[读书社区]值得珍藏的81句名言...
查看>>
ASCⅡ码表
查看>>
Server-U4架设FTP服务器
查看>>
电脑端口基础知识
查看>>
富人和穷人的12大经典差异
查看>>
市场营销学经典语句摘录!
查看>>
谈IT技术人员的创业---作者:李立辉-----转自www.01ch.net
查看>>
背单词最科学的方法
查看>>
杨凡老师谈怎样背好单词
查看>>
很有用的哦。。历年考研英语翻译精解(2003-1994)
查看>>
如何突破英语口语  
查看>>