比如下面html代码
<ul>
<li class="aaaa" title="ttt">li-1</li>
<li class="bbbb">li-2</li>
<li title="fffff">li-2</li>
</ul>
<div class="aaaa" title="ttt">li-1</div>
<div class="bbbb">li-2</div>
<div title="fffff">li-2</div>
---------------------------
第一种根据属性选择E[@attr]
$("[@title]").click()..........
即选择所有元素内 属性带有title的元素
即
<li class="aaaa" title="ttt">li-1</li>
<li title="fffff">li-2</li>
<div class="aaaa" title="ttt">li-1</div>
<div title="fffff">li-2</div>
$("div[@title]").click()..........
选择所有div标签下的所有带title的元素
即
<div class="aaaa" title="ttt">li-1</div>
<div title="fffff">li-2</div>
第二种根据属性值选择E[@attr=val]
$("div[@title=ttt]").click()................
选择div下所有title属性等于ttt的元素
即
<div class="aaaa" title="ttt">li-1</div>
如果是 $("[@title=ttt]").click()................
所有元素下属性title等于ttt的元素
<li class="aaaa" title="ttt">li-1</li>
<div class="aaaa" title="ttt">li-1</div>
第三种根据属性值开始字母选择E[@attr^=val]
$("div[@title^=t]").click()................
所有div元素下所有属性title值是以t为开头的元素
第三种根据属性值开始字母选择E[@attr$=val]
$("div[@title$=t]").click()................
所有div元素下所有属性title值是以t为结尾的元素
第三种根据属性值包含字母选择E[@attr*=val]
$("div[@title*=t]").click()................
所有div元素下所有属性title值是包含t的所有元素
第三种根据多个属性选择E[@attr=val][@attr=val]
$("div[@title=ttt][@class=aaaa]").click()................
所有div元素下所有属性title值是等于ttt并且属性class等于aaaa的元素
分享到:
相关推荐
《jQuery CSS和XPath选择器详解》 jQuery是一个广泛使用的JavaScript库,它的核心功能之一就是强大的选择器引擎。这个引擎不仅支持CSS1-3的选择器语法,还兼容XPath选择器,并在此基础上进行了扩展,使得开发者能更...
JQuery选择器,xpath类型等的选择器
### jQuery详解:掌握高效网页编程的关键工具 #### 引言 jQuery是一款革命性的JavaScript库,极大地简化了HTML文档遍历、事件处理、动画以及Ajax交互等复杂操作,使其变得更为简单直观。对于初学者和经验丰富的...
**jQuery-XPath 知识点详解** jQuery-XPath 是一个专为 Enketo 智能纸设计的XPath工具集合,它将XPath的功能与jQuery的灵活性相结合,为开发者提供了更强大的数据处理和页面操作能力。XPath(XML Path Language)是...
《jQuery效果使用详解》 jQuery,作为一款强大的JavaScript库,极大地简化了JavaScript的DOM操作,特别是在处理CSS选择器和XPath支持方面,使得开发者能够更加高效地编写JavaScript代码,即便是对于JavaScript初学...
**JSoup与XPath详解** JSoup是一个用于Java的开源库,设计目的是为了处理HTML文档,提取和操作数据。它的核心功能在于提供了一种简洁而强大的API,使得开发者能够方便地解析、遍历以及修改HTML文档。JSoup可以理解...
### jQuery基础教程知识点详解 #### 一、jQuery技术框架概览 **1.1 jQuery的起源与发展** - **创建者**: John Resig在2006年初创建了jQuery。 - **最新版本**: 截至资料所述时,最新版本为1.3.2。 - **官方...
### jQuery常用功能详解 #### 一、页面元素的引用 在使用jQuery时,最基础的操作之一就是选择页面上的元素。这通常通过`$()`符号来完成。jQuery的强大之处在于它支持多种选择器语法,比如: - **ID选择器**:通过...
**知识点详解:JQuery系统介绍** ### 一、JQuery概览 JQuery是一个轻量级的JavaScript类库,自2006年由John Resig创立以来,迅速成长为全球最广泛应用的JavaScript库之一。它的设计理念是“Write Less, Do More”...
**jQuery计算器插件详解** jQuery是一款轻量级的JavaScript库,因其简洁的API和高效的DOM操作而广受开发者喜爱。本篇文章将详细讲解基于jQuery构建的一款简洁美观的计算器插件,帮助你理解如何利用jQuery创建交互式...
### jQuery 教程知识点详解 #### 一、jQuery 概述 - **定义**:jQuery 是一个快速、简洁的 JavaScript 库,它极大地简化了 HTML 文档遍历、事件处理、动画以及 AJAX 交互等任务。 - **特点**:jQuery 的核心特性...
1. **选择器**:jQuery提供了一系列CSS和XPath选择器,使得能够快速定位到DOM元素,如`$("#id")`用于选取ID为`id`的元素,`$(".class")`用于选取所有类名为`class`的元素。 2. **DOM操作**:通过jQuery,可以轻松地...
### jQuery核心语法详解 #### 一、页面元素的引用 在使用jQuery时,最基础的操作之一就是选择页面上的元素。这通常通过`$()`函数来完成。`$()`函数可以根据不同的选择器(如ID、类名、元素名称、层级关系等)来...
- **选择器**:jQuery 支持 XPath 和 CSS 选择器语法的组合,包括元素选择器、属性选择器、CSS 选择器等,例如 `$("div.classname")`、`$("[name='example']")`。 #### 五、文档就绪函数 所有 jQuery 函数应置于 *...
#### 五、JQuery 选择器详解 JQuery 提供了一系列强大的选择器,可以满足开发者在不同场景下的需求。 - `*`:选取文档中的所有元素。 - `#id`:选取 ID 为 `id` 的元素。 - `.class`:选取所有类名为 `class` 的...
### jQuery API 知识点详解 #### 一、概述 jQuery 是一款轻量级的 JavaScript 库,极大地简化了 HTML 文档遍历、事件处理、动画等操作。它提供了丰富的 API,让开发者能够轻松地进行网页开发。本文将对 jQuery API ...
### jQuery UI 树状下拉选择框(Comboxtree)详解 #### 一、引言 随着 WEB2.0 及 AJAX 思想在互联网上的快速发展与传播,一系列优秀的 JavaScript 框架相继诞生,例如 Prototype、YUI、jQuery、MooTools、Bindows ...
### jQuery技巧详解 #### 一、简介 ##### 1.1 概述 随着Web 2.0技术的发展,特别是Ajax思想的普及,各种JavaScript框架应运而生,旨在简化前端开发过程,提升开发效率。其中,jQuery因其简洁、易用的特点,在众多...