jquery选择器、属性设置用法

深碍√TFBOYSˉ_ 2023-01-09 01:09 111阅读 0赞

本人是一名小白，应届毕业生，以前没用过jquery，最近做项目用到了jquery。在做的过程中走了很多弯路，不停的搜索。总结出了一些用法，供大家参考：

最基本的选择器语法包括：id、class、标签、属性，这和css选择器是一致的。

ID选择器要在ID前加\#，比如要选择一个ID为myDivID的div元素（<div id="myDivID"></div>）可以这样写:

$("#myDivID");

ID是不能重复的，所以ID选择器选出来的是一个jquery对象。

class选择器要在class前加点（.），比如要选择一个class为myInputClass的input元素（<input type="text" class="myInputClass"/>）可以这样写：

$(".myInputClass");

class是可以重复的，所以class选择器选出来的可以是一类元素，即好多个元素，所以jquery选出来的是个数组，可以引用下标来选择每个元素：比如

for(var i = 0; i < $(".myInputClass").length; i++) {$(".myInputClass")[i];}

这样可以迭代出每个元素。

标签选择器直接写标签类型即可，比如要选择一个段落p标签（<p></p>）即可这样写：

$("p");

标签选择器选出来的也是一个数组，选出所有的p标签元素，也可以用上面的方法迭代出所有的元素。

属性选择器要在前面加方括号（\[\]），比如要选择含有name="xxName"的元素，可以这样写：

$("[name='xxName']");

这样来选择，选择出的也是一个数组，因为name是可以重复的。

ID选择器可以精确的选出一个元素来，但在开发中我们可能更多的要选择出一组元素，怎样才能精确的选择出我们想要的元素呢，其实几种选择器是可以混合使用的：

<div id="attrValueTab">
     <p> 
     <input type="button" value="确定" /> <input type="text" value="odd" /> <input type="text" value="even" />
     </p>
     <p> 
     <input type="button" value="取消" /> <input type="text" value="odd" /> <input type="text" value="even" />
     </p>
    </div>

比如我们要选择偶数个文本标签，即：写着even的文本框。我们可以这样来选择：

首先选中这个div，然后再选中p，然后再选中type=“text”的文本框，最后再选中偶数个位置：

$("#attrValueTab p input[type='text']:even");

组合选择在开发中是非常有用的。可以用下面这种方法来选中被勾选的button或者是checkbox元素：

$("input[name='avDefValue_input']:checked");

js设置radio只读:

var radios =  $("\#credenceAuth \[name='credenceAuthFlag'\]:radio");

radios\[0\].disabled=true;

发表评论取消回复

表情：

评论列表（有 0 条评论，111人围观）

还没有评论，来说两句吧...

相关阅读

相关 jQuery选择器、jQuery关系选择器、jQuery伪选择器

一、jQuery选择器 1、父元素(向上遍历单一层级)：parent() 2、祖先元素：parents(selector) 3、子元素(向下遍历单一层级)：child

本是古典何须时尚/ 2023年10月07日 11:58/ 0 赞/ 33 阅读

相关 jquery选择器、属性设置用法

本人是一名小白，应届毕业生，以前没用过jquery，最近做项目用到了jquery。在做的过程中走了很多弯路，不停的搜索。总结出了一些用法，供大家参考：最基本的选择器语法包括

深碍√TFBOYSˉ_/ 2023年01月09日 01:09/ 0 赞/ 112 阅读

相关 css 属性选择器_CSS选择器：属性选择器

css 属性选择器 ![cssmasterthumb][] The following is an extract from our book, [CSS Master][

本是古典何须时尚/ 2022年12月03日 09:59/ 0 赞/ 355 阅读

相关 jquery属性过滤选择器，attr

1.1．属性过滤选择器根据元素的属性来过滤 ^=匹配以某些内容开始 $=匹配以某些内容结尾 \=匹配是否包含某些指定的元素示例： $(func

Myth丶恋晨/ 2022年06月06日 06:25/ 0 赞/ 265 阅读

相关 jquery 常用选择器

1. 元素选择器： 1) $（“p”）：选取p元素 2) $（“p.info”）：选取class=“info”中所有的p元素 3

比眉伴天荒/ 2022年06月04日 08:21/ 0 赞/ 181 阅读

相关 jQuery选择器之属性选择器

转载：[https://blog.csdn.net/linshichen/article/details/51576461][https_blog.csdn.net_linsh

冷不防/ 2022年03月22日 14:01/ 0 赞/ 362 阅读

相关 JQuery常用选择器

什么是JQuery > Jquery就是JS的封装并做了简化处理。 JQuery的优势 > 轻量级的js库 > 强大的选择器 > 支持DOM操作

水深无声/ 2021年09月28日 06:16/ 0 赞/ 298 阅读

相关 jQuery 属性选择器

选择器： jQuery 使用 CSS 选择器来选取 HTML 元素。 $("p") 选取 <p> 元素。 $("p.intro") 选取所有 class="intro"

淩亂°似流年/ 2021年09月26日 12:20/ 0 赞/ 402 阅读

相关 jQuery--过滤选择器（可见性过滤选择器、属性过滤选择器）详解

可见性过滤选择器可见性过滤选择器是指根据元素的可见性来筛选元素的选择器。 <table> <thead> <tr> <th align="cente

曾经终败给现在/ 2021年08月14日 02:04/ 0 赞/ 467 阅读

相关 jQuery选择器之属性筛选选择器用法详解

在这么多属性选择器中[attr="value"]和[attr*="value"]是最实用的 [attr="value"]能帮我们定位不同类型的元素，特别是表单form元...

Bertha 。/ 2021年07月04日 12:07/ 0 赞/ 542 阅读