首页 web前端 js教程 读jQuery之三(构建选择器)_jquery

读jQuery之三(构建选择器)_jquery

May 16, 2016 pm 06:05 PM
选择器

为了叙述每一篇的重点,其示例代码都是最精简的,比如选择器只能传HTMLElement和id。

这篇我们增强下选择器,依据2/8原则,这里仅实现最常用的几种。


1, 通过id获取,该元素是唯一的
$('#id')

2, 通过className获取
$('.cls') 获取文档中所有className为cls的元素
$('.cls', el)
$('.cls', '#id')
$('span.cls') 获取文档中所有className为cls的span元素
$('span.cls', el) 获取指定元素中className为cls的元素, el为HTMLElement (不推荐)
$('span.cls', '#id') 获取指定id的元素中className为cls的元素

3, 通过tagName获取
$('span') 获取文档中所有的span元素
$('span', el) 获取指定元素中的span元素, el为HTMLElement (不推荐)
$('span', '#id') 获取指定id的元素中的span元素

4, 通过attribute获取
$('[name]') 获取文档中具有属性name的元素
$('[name]', el)
$('[name]', '#id')
$('[name=uname]') 获取文档中所有属性name=uname的元素
$('[name=uname]', el)
$('[name=uname]', '#id')
$('input[name=uname]') 获取文档中所有属性name=uname的input元素
$('input[name=uname]', el)
$('input[name=uname]', '#id')

示例:

复制代码 代码如下:





zchain test



aaa

bbb

ccc








Firebug输出如下

读jQuery之三(构建选择器)_jquery


http://demo.jb51.net/js/2011/zchain/zchain-0.3.js
本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn

热AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智能驱动的应用程序,用于创建逼真的裸体照片

AI Clothes Remover

AI Clothes Remover

用于从照片中去除衣服的在线人工智能工具。

Undress AI Tool

Undress AI Tool

免费脱衣服图片

Clothoff.io

Clothoff.io

AI脱衣机

Video Face Swap

Video Face Swap

使用我们完全免费的人工智能换脸工具轻松在任何视频中换脸!

热门文章

<🎜>:泡泡胶模拟器无穷大 - 如何获取和使用皇家钥匙
3 周前 By 尊渡假赌尊渡假赌尊渡假赌
北端:融合系统,解释
3 周前 By 尊渡假赌尊渡假赌尊渡假赌
Mandragora:巫婆树的耳语 - 如何解锁抓钩
3 周前 By 尊渡假赌尊渡假赌尊渡假赌

热工具

记事本++7.3.1

记事本++7.3.1

好用且免费的代码编辑器

SublimeText3汉化版

SublimeText3汉化版

中文版,非常好用

禅工作室 13.0.1

禅工作室 13.0.1

功能强大的PHP集成开发环境

Dreamweaver CS6

Dreamweaver CS6

视觉化网页开发工具

SublimeText3 Mac版

SublimeText3 Mac版

神级代码编辑软件(SublimeText3)

热门话题

Java教程
1665
14
CakePHP 教程
1424
52
Laravel 教程
1322
25
PHP教程
1270
29
C# 教程
1249
24
使用:nth-child(n+3)伪类选择器选择位置大于等于3的子元素的样式 使用:nth-child(n+3)伪类选择器选择位置大于等于3的子元素的样式 Nov 20, 2023 am 11:20 AM

使用:nth-child(n+3)伪类选择器选择位置大于等于3的子元素的样式,具体代码示例如下:HTML代码:&lt;divid="container"&gt;&lt;divclass="item"&gt;第一个子元素&lt;/div&gt;&lt;divclass="item"&

css中id选择符的标识是什么 css中id选择符的标识是什么 Sep 22, 2022 pm 03:57 PM

在css中,id选择符的标识是“#”,可以为标有特定id属性值的HTML元素指定特定的样式,语法结构“#ID值 {属性 : 属性值;}”。ID属性在整个页面中是唯一不可重复的;ID属性值不要以数字开头,数字开头的ID在Mozilla/Firefox浏览器中不起作用。

javascript选择器失效怎么办 javascript选择器失效怎么办 Feb 10, 2023 am 10:15 AM

javascript选择器失效是因为代码不规范导致的,其解决办法:1、把引入的JS代码去掉,ID选择器方法即可有效;2、在引入“jquery.js”之前引入指定JS代码即可。

css伪选择器学习之伪类选择器解析 css伪选择器学习之伪类选择器解析 Aug 03, 2022 am 11:26 AM

在之前的文章《css伪选择器学习之伪元素选择器解析​》中,我们学习了伪元素选择器,而今天我们详细了解一下伪类选择器,希望对大家有所帮助!

css中的选择器包括超文本标记选择器吗 css中的选择器包括超文本标记选择器吗 Sep 01, 2022 pm 05:25 PM

不包括。css选择器有:1、标签选择器,是通过HTML页面的元素名定位具体HTML元素;2、类选择器,是通过HTML元素的class属性的值定位具体HTML元素;3、ID选择器,是通过HTML元素的id属性的值定位具体HTML元素;4、通配符选择器“*”,可以指代所有类型的标签元素,包括自定义元素;5、属性选择器,是通过HTML元素已经存在属性名或属性值来定位具体HTML元素。

一文了解lxml支持的选择器有哪些 一文了解lxml支持的选择器有哪些 Jan 13, 2024 pm 02:08 PM

lxml是一个功能强大的Python库,用于处理XML和HTML文档。作为一种解析工具,它提供了多种选择器来帮助用户方便地从文档中提取所需的数据。本文将详细介绍lxml支持的选择器。lxml支持以下几种选择器:标签选择器(ElementTagSelector):通过标签名称来选择元素。例如,通过使用<tagname>来选择具有特定标签名称的元

深度解析is与where选择器:提升CSS编程水平 深度解析is与where选择器:提升CSS编程水平 Sep 08, 2023 pm 08:22 PM

深度解析is与where选择器:提升CSS编程水平引言:在CSS编程过程中,选择器是必不可少的元素。它们允许我们根据特定的条件选择HTML文档中的元素并对其进行样式化。在这篇文章中,我们将深入探讨两个常用的选择器,即:is选择器和where选择器。通过了解它们的工作原理和使用场景,我们可以大大提升CSS编程的水平。一、is选择器is选择器是一个非常强大的选择

wxss选择器有哪些 wxss选择器有哪些 Sep 28, 2023 pm 04:27 PM

wxss选择器有元素选择器、类选择器、ID选择器、伪类选择器、子元素选择器、属性选择器、后代选择器和通配选择器等。详细介绍:1、元素选择器,使用元素名称作为选择器,选取匹配的元素,使用“view”选择器可以选取所有的“view”组件;2、类选择器,使用类名作为选择器,选取具有特定类名的元素,使用“.classname”选择器可以选取具有“.classname”类名的元素等等。

See all articles