作家
登录

juqery 学习之三 选择器 可见性 元素属性

作者: 来源:www.28hudong.com 2013-03-30 01:08:58 阅读 我要评论

:hidden 匹配所有的不可见元素,input 元素的 type 属性为 "hidden" 的话也会被匹配到 Matches all elements that are hidden, or input elements of type "hidden". 返回值 Array<Element> 示例 查找所有不可见的 tr 元素 HTML 代码: <table> <tr style="display:none"><td>Value 1</td></tr> <tr><td>Value 2</td></tr></table> jQuery 代码: $("tr:hidden") 结果: [ <tr style="display:none"><td>Value 1</td></tr> ] --------------------------------------------------------------------------------------- :visible 匹配所有的可见元素 Matches all elements that are visible. 返回值 Array<Element> 示例 查找所有可见的 tr 元素 HTML 代码: <table> <tr style="display:none"><td>Value 1</td></tr> <tr><td>Value 2</td></tr></table> jQuery 代码: $("tr:visible") 结果: [ <tr><td>Value 2</td></tr> ] --------------------------------------------------------------------------------------- [attribute] 匹配包含给定属性的元素 Matches elements that have the specified attribute. 返回值 Array<Element> 参数 attribute (String) : 属性名 示例 查找所有含有 id 属性的 div 元素 HTML 代码: <div> <p>Hello!</p></div><div id="test2"></div> jQuery 代码: $("div[id]") 结果: [ <div id="test2"></div> ] --------------------------------------------------------------------------------------- [attribute=value] 匹配给定的属性是某个特定值的元素 Matches elements that have the specified attribute with a certain value. 返回值 Array<Element> 参数 attribute (String) : 属性名 value (String) : 属性值。引号在大多数情况下是可选的。但在遇到诸如属性值包含"]"时,用以避免冲突。 示例 查找所有 name 属性是 newsletter 的 input 元素 HTML 代码: '<input type="checkbox" name="newsletter" value="Hot Fuzz" /><input type="checkbox" name="newsletter" value="Cold Fusion" /><input type="checkbox" name="accept" value="Evil Plans" /> jQuery 代码: $("input[name='newsletter']").attr("checked", true); 结果: [ <input type="checkbox" name="newsletter" value="Hot Fuzz" checked="true" />, <input type="checkbox" name="newsletter" value="Cold Fusion" checked="true" /> ] --------------------------------------------------------------------------------------- [attribute!=value] 匹配给定的属性是不包含某个特定值的元素 Matches elements that don't have the specified attribute with a certain value. 返回值 Array<Element> 参数 attribute (String) : 属性名 value (String) : 属性值。引号在大多数情况下是可选的。但在遇到诸如属性值包含"]"时,用以避免冲突。 示例 查找所有 name 属性不是 newsletter 的 input 元素 HTML 代码: '<input type="checkbox" name="newsletter" value="Hot Fuzz" /><input type="checkbox" name="newsletter" value="Cold Fusion" /><input type="checkbox" name="accept" value="Evil Plans" /> jQuery 代码: $("input[name!='newsletter']").attr("checked", true); 结果: [ <input type="checkbox" name="accept" value="Evil Plans" checked="true" /> ] --------------------------------------------------------------------------------------- [attribute^=value] 匹配给定的属性是以某些值开始的元素 Matches elements that have the specified attribute and it starts with a certain value. 返回值 Array<Element> 参数 attribute (String) : 属性名 value ( String) : 属性值。引号在大多数情况下是可选的。但在遇到诸如属性值包含"]"时,用以避免冲突。 示例 查找所有 name 以 'news' 开始的 input 元素 HTML 代码: <input name="newsletter" /><input name="milkman" /><input name="newsboy" /> jQuery 代码: $("input[name^='news']") 结果: [ <input name="newsletter" />, <input name="newsboy" /> ] --------------------------------------------------------------------------------------- [attribute$=value] 匹配给定的属性是以某些值结尾的元素 Matches elements that have the specified attribute and it ends with a certain value. 返回值 Array<Element> 参数 attribute (String) : 属性名 value (String) : 属性值。引号在大多数情况下是可选的。但在遇到诸如属性值包含"]"时,用以避免冲突。 示例 查找所有 name 以 'letter' 结尾的 input 元素 HTML 代码: <input name="newsletter" /><input name="milkman" /><input name="jobletter" /> jQuery 代码: $("input[name$='letter']") 结果: [ <input name="newsletter" />, <input name="jobletter" /> ] --------------------------------------------------------------------------------------- [attribute*=value] 匹配给定的属性是以包含某些值的元素 Matches elements that have the specified attribute and it contains a certain value. 返回值 Array<Element> 参数 attribute (String) : 属性名 value (String) : 属性值。引号在大多数情况下是可选的。但在遇到诸如属性值包含"]"时,用以避免冲突。 示例 查找所有 name 包含 'man' 的 input 元素 HTML 代码: <input name="man-news" /><input name="milkman" /><input name="letterman2" /><input name="newmilk" /> jQuery 代码: $("input[name*='man']") 结果: [ <input name="man-news" />, <input name="milkman" />, <input name="letterman2" /> ] --------------------------------------------------------------------------------------- [selector1][selector2][selectorN] 复合属性选择器,需要同时满足多个条件时使用。 Matches elements that have the specified attribute and it contains a certain value. 返回值 Array<Element> 参数 selector1 (Selector) : 属性选择器 selector2 (Selector) : 另一个属性选择器,用以进一步缩小范围 selectorN (Selector) : 任意多个属性选择器 示例 找到所有含有 id 属性,并且它的 name 属性是以 man 结尾的 HTML 代码: <input id="man-news" name="man-news" /><input name="milkman" /><input id="letterman" name="new-letterman" /><input name="newmilk" /> jQuery 代码: $("input[id][name$='man']") 结果: [ <input id="letterman" name="new-letterman" /> ]

  推荐阅读

  用js来解决ajax读取页面乱码

例子: rsajax.js: 复制代码 代码如下: var http_request = false; function makePOSTRequest(url, parameters) { http_request = false; if (window.XMLHttpRequest) { http_request = new XMLHttpRequest(); if>>>详细阅读


本文标题:juqery 学习之三 选择器 可见性 元素属性

地址:http://www.17bianji.com/kaifa2/JS/25316.html

关键词: 探索发现

乐购科技部分新闻及文章转载自互联网,供读者交流和学习,若有涉及作者版权等问题请及时与我们联系,以便更正、删除或按规定办理。感谢所有提供资讯的网站,欢迎各类媒体与乐购科技进行文章共享合作。

网友点评
自媒体专栏

评论

热度

精彩导读
栏目ID=71的表不存在(操作类型=0)