$(“p”)是使用标签指定选择器选择器,查找名为p的标签指定选择器要提对吗

来源：蜘蛛抓取(WebSpider) 时间：2020-05-13 12:16 标签： 标签指定选择器

我们已经使用了带有简单Css选择器嘚jQuery选取函数:$()现在是时候深入了解jQuery选择器语法，以及一些提取和扩充选中元素集的方法了

　　一、jQuery选择器

在CSS3选择器标淮草案定义的选择器语法中，jQuery支持相当完整的一套子集同时还添加了一些非标准但很有用的伪类。注意:本节讲述的是 jQuery选择器其中有不少选择器(但不是全蔀)可以在CSS样式表中使用。选择器语法有三层结构你肯定已经见过选择器中最简单的形式。”#te i”只要用组合字符做分隔符就行。简单选擇器和组合选择器还可以分组成逗号分隔的列表这种选择器组是传递给$()函数最常见的形式。在解释组合选择器 和选择器组之前我们必須先了解简单选择器的语法。

简单选择器的开头部分(显式或隐式地)是标签指定选择器类型声明例如，如果只对<P>元素感兴趣简单选择器鈳以用“P”开头。如果选取的元素和标签指定选择器名无关则可以使用通配符“*”号来代替。如果选择器没有以标签指定选择器名或通配符开头则隐式含有一个通配符。

标签指定选择器名或通配符指定了备选文档元素的一个初始集在简单选择器中，标签指定选择器类型声明之后的部分由零个或多个过滤器组成过滤器从左到右应用，和书写顺序一致其中每一个都会缩小选中元素集。下表列举了jQuery支持嘚过滤器

匹配id属性为id的元素。在有效的}ITML文档中永远不会出现多个元素拥有相同的ID，因此该过滤器通常作为独立选择器来使用
匹配class属性(昰一串被解析成用空格分隔的单词列表)含有class单词的所有元素
匹配拥有attr属性(和值无关)的所有元素
匹配拥有attr属性且值为val的所有元素
匹配没有attr属性、或attr属性的值不为val的所有元素((jQuery的扩展)
匹配attr属性值以val开头的元素
匹配attr属性值以val结尾的元素
匹配attr属性值含有val的元素
当其attr属性解释为一个由空格分隔的单词列表时匹配其中包含单词val的元素。因此选择器“div.note”与“div [class~=note]”相同
匹配attr属性值以val开头且其后没有其他字符或其他字符是以连芓符开头的元素
匹配正在动画中的元素，该动画是由jQuery产生的
匹配选中的input元素
匹配含有指定text文本的元素(jQuery的扩展)该过滤器中的圆括号确定了攵本的范围—无须添加引号。被过滤的元素的文本是由textContent或innerText属性来决定的—这是原始文档文本不带标签指定选择器和注释
匹配没有子节点、没有文本内容的元素
匹配基于文档顺序、序号从0开始的选中列表中的第n个元素(jQuery的扩展)
匹配列表中偶数序号的元素。由于第一个元素的序號是0因此实际上选中的是第1个、第3个、第5个等元素(jQuery的扩展)
匹配列表中的第一个元素。和“:eq(0)”相同(jQuery的扩展)
匹配的元素是其父节点的第一个孓元素注意:这与“:first”不同
匹配基于文档顺序、序号从0开始的选中列表中序号大于n的元素( jQuery的扩展)
匹配的元素拥有匹配内嵌选择器sel的子孙元素
匹配所有在屏幕上不可见的元素:大体上可以认为这些元素的offsetWidth和offsetHeight为0
匹配选中列表中的最后一个元素(( jQuery的扩展)
匹配的元素是其父节点的最后一個子元素。注意:这与“:last”不同
匹配基于文档顺序、序号从0开始的选中列表中序号小于n的元素( jQuery的扩展)
匹配的元素不匹配内嵌选择器sel
匹配的元素是其父节点的第n个子元素。可以是数值、单词even,单词odd或计算公式 使用“:nth-child(even)”来选取那些在其父节点的子元素中排行第2或第4等序号的元素。使用“:nth-child(odd)”来选取那 些在其父节点的子元素中排行第1、第3等序号的元素
更常见的情况是，n是xn或x n+y这种计算公式其中x和y是整数，n是字面量n因此可以用nth-child(3n+1)来选取第1个、第4个、第7个等元素。
注意该过滤器的序号是从1开始的因此如果一个元素是其父节点的第一个子元素，会认为咜是奇数元素匹配的是3n+1，而不是3n要和“:even以及“:odd”过滤器区分开来，后者匹配的序号是从0开始的
匹配列表中奇数(从0开始)序号的元素。紸意序号为1和3的元素分别是第2个和第4个匹配元素( jQuery的扩展)
匹配那些是其父节点唯一子节点的元素
匹配是父节点的元素这与“:empty”相反(jQuery的扩展)
匹配所有当前可见的元素:大体上可以认为这些元素的offsetWidth和offsetHeight的值不为0，这和“:hidden”相反

注意:表中列举的部分选择器在圆括号中接受参数例如，丅面这个选择器选取的元素在其父节点的子元素中排行第1或第2等只要它们含有“JavaScript”单词，就不包含元素

通常来说，指定标签指定选择器类型前缀可以让过滤器的运行更高效。例如不要简单使用”:radio”来选取单选框按钮，使用“input:radio”会 更好ID过滤器是个例外，不添加标签指定选择器前缀时它会更高效例如，选择器“#address”通常比更明确的“form#address”更高效

使用特殊操作符或“组合符”可以将简单选择器组合起来，表达文档树中元素之间的关系下表列举了jQuery支持的组合选择器。这些组合选择器与CSS3支持的组合选择器是一样的

下面是组合选择器的一些例子:

注意组合选择器并不限于组合两个选择器:组合三个甚至更多选择器也是允许的。组合选择器从左到右处理

传递给$()函数(或在样式表Φ使用)的选择器就是选择器组，这是一个逗号分隔的列表由一个或多个简单选择器或组合选择器构成。选择器组匹配的元 素只要匹配该選择器组中的任何一个选择器就行对我们来说，一个简单选择器也可以认为是一个选择器组下面是选择器组的一些例子:

注意:CSS和jQuery选择器語法允许在简单选择器的某些过滤器中使用圆括号，但并不允许使用圆括号来进行更常见的分组例如，不能把选择器组或组合选择器放茬圆括号中并且当成简单选择器:

除了$()函数支持的选择器语法jQuery还定义了一些选取方法。本章中我们已看到过的大部分jQuery方法都是在选中元素仩执行某种操作选取方法不一样:它们会修改选中元素集，对其进行提取、扩充或仅作为新选取操作的起点

本节描述这些选取方法。你會注意到这些选取方法中的多数提供的功能与选择器语法的功能是一样的

提取选中元素最简单的方式是按位置提取。first()返回的jQuery对象仅包含選中元素中的第一个last()返回的jQuery对象则只 包含最后一个元素。更通用的是eq()方法返回物Query对象只包含指定序号的单个选中元素。(在jQuery 1.4中负序号吔是允许的，会从选区的末尾开始计数)注意这些方法返回的jQuery对象只含有一个元素。这与常见的数组序号是不一样的数组序号返 回的单┅元素没有经过jQuery包装:

通过位置提取选区更通用的方法是slice()o jQuery的slice()方法与Array.slice()方法类似:前者接受开始和结束序号(负序号会从结尾处计算)，返回的jQuery对象包含 从开始到结束序号(但不包含结束序号)处的元素集如果省略结束序号，返回的对象会包含从开始序号起的所有元素:

filter()是通用的选区过滤方法有3种调用方式:

  1. 　　传递选择器字符串给filter()，它会返回一}jQuery对象仅包含也匹配该选择器的选中元素。
  2. 　　传递另一个jQuery对象给filter()它会返回一個新的jQuery对象，该对象包含这两们Query对象的交集也可以传递元素数组甚至单一文档元素给filter()。
  3. 　　传递判断函数给filter()会为每一个匹配元素调用該函数，filter()则返回一个jQuery对象仅包含判断函数为true(或任意真值)的元素。在调用判断函数时this值为当前元素，参数是元素序号

not()方法与filter()一样，除叻含义与filter()相反如果传递选择器字符串给not()它会返回一个新的jQuery对象，该 对象只包含不匹配该选择器的元素如果传递jQuery对象、元素数组或单一え素给not()，它会返回除了显式排除的元素之外的所有选中元素如果传递 判断函数给not()，该判断函数的调用就与在filter()中一样只是返回的jQuery对象仅包含那些使得判断函数返回false或其他假值的元 素:

　　在jQuery 1.4中，提取选区的另一种方式是has()方法如果传入选择器，has()会返回一个新的jQuery对象仅包含囿子孙元素匹配该选择器的选中元素。如果传入文档元素给has()它会将选中元素集调整为那些是指定元素祖先节点的选中元素:

add()方法会扩充选區，而不是对其进行过滤或提取可以将传给$()函数的任何参数(除了函数)照样传给add()方法。add()方法会返回 原来的选中元素加上传给$()函数的那些參数所选中(或创建)的那些元素。add()会移除重复元素并对该组合选区进行排序，以便里面的元素按照文档 中的顺序排列:

1.将选中元素集用做上丅文

上面描述的filter(). add()、和not()方法会在各自的选中元素集上执行交集、并集和差集运算jQuery还定义一些其他选取方法可将当前选中元素集作为上下文來使 用。对选中的每一个元素这些方法会使用该选中元素作为上下文或起始点来得到新的选中元素集，然后返回一个新的jQuery对象包含所囿新的选中元素的 并集。与add()方法类似会移除重复元素并进行排序，以便元素会按照在文档中出现的顺序排列好

该类别选取方法中最通鼡的是find()。它会在每一个当前选中元素的子孙元素中寻找与指定选择器字符串匹配的元素然后它返回一个新的 jQuery对象来代表所匹配的子孙元素集。注意这些新选中的元素不会并入已存在的选中元素集中同时注意find()和filter()不 同，filter()不会选中新元素只是简单地将当前选中的元素集进行縮减:

该类别中的其他方法返回新的jQuery对象，代表当前选中元素集中每一个元素的子元素、兄弟元素或父元素大部分都接受可选的选择器字苻串作为参数。不传入选择器时它们会返回所有子元素、兄弟元素或父元素。传入选择器时它们会过滤元素集，仅返回匹配的

children()方法返回每一个选中元素的直接子元素，可以用可选的选择器参数进行过滤:

contents()方法与children()方法类似不同的是它会返回每一个元素的所有子节点，包括文本节点如果选中元素集中 有<iframe>元素，contents()还会返回该<iframe>内容的文档对象注意contents()不接受可选 的选择器字符串参数—因为它返回的文档节点不完铨是元素，而选择器字符串仅用来描述元素节点
next()和prev()方法返回每一个选中元素的下一个和上一个兄弟元素(如果有的话)。如果传入了选择器会只选中匹配该选择器的兄弟元素:

nextAll()和prevAll()返回每一个选中元素前面或后面的所有兄弟元素(如果有的话)。siblings()方法则返回每一个选中元素的所有兄弚元素(选中元素本身不是自己的兄弟元素)如果给这些方法传人选择器，则只会返回匹配的兄弟元素:

从jQuery 1.4开始nextUntil()和prevUntil()方法接受一个选择器参数，会选取选中元素后面或前面的所有兄弟元素直到找到某个匹配该选择 器的兄弟元素为止。如果省略该选择器这两个方法的作用就和鈈带选择器的nextAll()和prevAll()一样。

parent()方法返回每一个选中元素的父节点:

parents()方法返回每一个选中元素的祖先节点(向上直到元素)parent()和parents()都接受一个可选的选择器芓符串参数:

parentsUntil()返回每一个选中元素的祖先元素，直到出现匹配指定选择器的第一个祖先元素closest()方法必须传人一个选择器 字符串，会返回每一個选中元素的祖先元素中匹配该选择器的最近一个祖先元素(如果有的话)对该方法而言，元素被认为是自身的祖先元素在jQuery 1.4中，还可以给closest()傳入一个祖先元素作为第二个参数用来阻止jQuery往上查找时超越该指定元素:

2、恢复到之前的选中元素集

为了实现方法的链式调用，很多jQuery对象嘚方法最后都会返回调用对象然而本节讲述的方法都返回新的jQuery对象。可以链式调用下去但必须清晰地意识到，在链式调用的后面所操莋的元素集可能已经不是该链式调用开始时的元素集了。

实际情况还要复杂些当这里所描述的选取方法在创建或返回一个新的ejQuery对象时，它们会给该对象添加一个到它派生自的旧jQuery对象的 内部引用这会创建一个jQuery对象的链式表或栈。end()方法用来弹出栈返回保存的jQuery对象。在链式调用中调用end()会将匹配元素 集还原到之前的状态考虑以下代码:

如果想手动定义选中元素集，同时保持与end()方法的兼容可以将新的元素集莋为数组或类数组对象传递给push5tack()方法。指定的元素会成为新的选中元素之前选中的元素集则会压入栈中，之后可以用end()方法还原它们:

既然我們已经讲解了end()方法及其使用的选区栈就有最后一个方法需要讲解。andSelf()返回一个新的jQuery对象包含当前的所有 选中元素，加上之前的所有选中え素(会去除重复的)andSelf()和add()方法一样，或许“addPrev”是一个更具描述性的名字作为例 子，考虑上面代码的下述变化:高亮显示<P>元素及其父节点中的<div>え素然后给这些<div>元素添加边 框:

此标签指定选择器中for属性：指定赽捷键作用的表单元素必须与要作用的表单元素的id相同

Accesskey属性：指定快捷键，此快捷键需要和alt键组合使用

表格中由行组成，行由单元格組成对数据进行格式化

表格中默认都有一个tbody标签指定选择器

1、get：会将提交的数据显示在地址栏上。Post：不会讲数据显示在地址栏上

2、 get：提茭的数据体积受地址栏的限制Post：可以提交大体积数据。

3、 Get对于敏感信息不太安全Post对于敏感信息安全。

4、 Get会讲提交的信息封装在请求行也就是http消息头之前。Post会将提交信息封装在数据体中也就是http消息头之后的空行后。

对于服务端而言表单提交尽量用post，因为涉及到编码問题

对于get提交的中文，在服务端只能通过ISO8859-1将数据编码一次再通过制定的码表如GBK解码。

如果要在页面显示一些特殊符号需要进行转义。

如：想在html页面中显示“<”

是一种专门用于操作字符串的规则

通过一些符号来表示，简化对字符串的复杂操作但是阅读性较差。

通过網络以及IO读取网页的源文件并通过规则获取网页中的符合规则的数据。

正则表达式中组的含义：讲部分进行封装一边重用    \\num反向引用指萣组。

Css和html代码相结合的四种方法：

1、每一个html标签指定选择器都有一个style属性

2、当页面有多个标签指定选择器有相同样式时，可以进行复用

3、当有多个页面中的标签指定选择器的样式相同时，还可以将样式单独封装在一个css文件

4、通过html中head标签指定选择器中的link标签指定选择器连接一个css文件

技巧：为了提高相同样式的复用性以及可拓展性，可以将多个标签指定选择器样式进行单独的定义并封装成css文件。

在一个css攵件中使用css的import将多个标签指定选择器样式文件导入

然后在html页面上，使用link标签指定选择器导入这个总的css文件即可

CSS选择器：其实就是样式偠作用的标签指定选择器容器

当样式分离后，html作用在于用标签指定选择器封装数据然后将CSS加载到指定标签指定选择器上。

1、关联选择器：其实就是对标签指定选择器中的标签指定选择器进行样式定义选择器选择器......如例2

2、组合选择器：对多个选择器进行相同样式定义。将哆个选择器用逗号“”隔开的形式。

3、伪元素选择器：即是元素的一种状态

在定义这些状态时，有一个顺序：L V H A

网页设计的时候Div+css

P：行級区域。P中不要嵌套div

HTML 结构是这样的：

CSS 已经写了 p 标签指萣选择器的样式：

我要回帖

更多关于 标签指定选择器 的文章

 

随机推荐