JQuery 元素选择器

jQuery 使用 CSS 选择器来选取 HTML 元素。

$("p") 选取 <p> 元素。

$("p.intro") 选取所有 class="intro" 的 <p> 元素。

$("p#demo") 选取所有 id="demo" 的 <p> 元素。


JQuery 属性选择器

jQuery 使用 XPath 表达式来选择带有给定属性的元素。

$("[href]") 选取所有带有 href 属性的元素。

$("[href='#']") 选取所有带有 href 值等于 "#" 的元素。

$("[href!='#']") 选取所有带有 href 值不等于 "#" 的元素。

$("[href$='.jpg']") 选取所有 href 值以 ".jpg" 结尾的元素。


更多的选择器实例

语法 描述
$(this) 当前 HTML 元素
$("p") 所有 <p> 元素
$("p.intro") 所有 class="intro" 的 <p> 元素
$(".intro") 所有 class="intro" 的元素
$("#intro") id="intro" 的元素
$("ul li:first") 每个 <ul> 的第一个 <li> 元素
$("[href$='.jpg']") 所有带有以 ".jpg" 结尾的属性值的 href 属性
$("div#intro .head") id="intro" 的 <div> 元素中的所有 class="head" 的元素

JQuery 事件

下面是 jQuery 中事件方法的一些例子:

Event 函数 绑定函数至
$(document).ready(function) 将函数绑定到文档的就绪事件(当文档完成加载时)
$(selector).click(function) 触发或将函数绑定到被选元素的点击事件
$(selector).dblclick(function) 触发或将函数绑定到被选元素的双击事件
$(selector).focus(function) 触发或将函数绑定到被选元素的获得焦点事件
$(selector).mouseover(function) 触发或将函数绑定到被选元素的鼠标悬停事件

JQuery选择器JQuery 事件的更多相关文章

  1. [jQuery] 选择器和事件

    jQuery选择器 属性选择器 <p>p1</p> <span style="font-size:24px;"></span>< ...

  2. jQuery选择器和事件

    选择器 常用事件 绑定与解除绑定 事件目标与冒泡 自定义事件

  3. JQuery:JQuery基本语法,JQuery选择器,JQuery DOM,综合案例 复选框,综合案例 随机图片

    知识点梳理 课堂讲义 1.JQuery快速入门 1.1.JQuery介绍 jQuery 是一个 JavaScript 库. 框架:Mybatis (jar包) 大工具 插件:PageHelper (j ...

  4. JQuery选择器,事件,DOM操作,动画

    JQuery是一个JavaScript代码库,或者是JavaScript框架: 1.选择器:(和CSS选择器一致) 基本选择器:ID选择器$('#div1');Class选择器('.div1');标签 ...

  5. jQuery选择器与事件学习笔记

    层次选择器:  $("div li")获取div下的所有li元素(后代.子.子的子......)  $("div>li")获取div下的直接li子元素.  ...

  6. 前端(jQuery)(2)-- JQuery选择器和事件

    1.选择器 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF ...

  7. jQuery选择器、事件、节点、动画效果

    一.选择器  基本选择器:    标签选择器:  $("h1").css()    类选择器:  $(".c").css()    id选择器:  $(&quo ...

  8. jQuery 学习01——定义、安装引用、语法、选择器及事件

    什么是 jQuery ? jQuery是一个JavaScript函数库. jQuery是一个轻量级的"写的少,做的多"的JavaScript库. jQuery库包含以下功能: HT ...

  9. jQuery选择器(一)

    晚上闲着没事,正好用来整理下jQuery的选择器,毕竟没有总结就不算学习嘛. 首先,对事件处理.遍历DOM和Ajax操作,都依赖于选择器. 1.CSS选择器 要使用某个HTML元素,就先要找到它,而c ...

随机推荐

  1. 随笔分类 - [C#6] 新增特性

    C#6.0中引入的基本特性总结 [C#6] 7-索引初始化器 摘要: 0. 目录 C#6 新增特性目录 1. 老版本的代码 早C#3中引入的集合初始化器,可是让我们用上面的语法来在声明一个字典或者集合 ...

  2. Play Framework 完整实现一个APP(十四)

    添加测试 ApplicationTest.java @Test public void testAdminSecurity() { Response response = GET("/adm ...

  3. ABP督导项目(1)

    创建实体 项目名TQMASP 在领域层创建entities文件夹存放实体类如图 创建Dbcontext public virtual IDbSet<Supervisor> Supervis ...

  4. C#中DateTime.Ticks属性及Unix时间戳转换

    1.相关概念 DateTime.Ticks:表示0001 年 1 月 1 日午夜 12:00:00 以来所经历的 100 纳秒数,即Ticks的属性为100纳秒(1Ticks = 0.0001毫秒). ...

  5. java中使用mongodb的几种方式

    最近有时间看了一下mongodb,因为mongodb更容易扩展所以考虑使用mongodb来保存数据. 首先下载安装mongodb,这是很简单的,装好后使用mongod命令就可以启动数据库.正式部署的话 ...

  6. Js IP转数字

    <script type="text/javascript"> function d2h(d) { return d.toString(16) } function h ...

  7. IIS 启用CORS ,IISExpress 通过IP 访问

      在IIS 10中启用CORS: <system.webServer> <handlers> <remove name="OPTIONSVerbHandler ...

  8. 【原】让H5页面适配移动设备全家 - 前端篇 - PPT

    7月份在部门内给设计中心的同事们带来<让H5页面适配移动设备全家 - 设计师篇 - PPT>的分享,在视觉和交互稿上提出页面适配的建议及提升页面体验的好处,促进前端和设计双方更好的合作,同 ...

  9. angularJS(3)

      angularJS(3) 一.angularJs的指令模型ng-model指令 ng-model 指令 绑定 HTML 元素 到应用程序数据. 为应用程序数据提供类型验证(number.email ...

  10. [LeetCode] Convert Sorted List to Binary Search Tree 将有序链表转为二叉搜索树

    Given a singly linked list where elements are sorted in ascending order, convert it to a height bala ...