`
KAXU
  • 浏览: 273453 次
  • 性别: Icon_minigender_1
  • 来自: 武汉
社区版块
存档分类
最新评论

jquery 选择器 E F

阅读更多

ancestor descendant

匹配所有的descendant 元素,其中descendant元素必须是ancestor 的子元素。返回匹配的结果集

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 
                    "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
  <script src="http://code.jquery.com/jquery-latest.js"></script>
  
  <script>
  $(document).ready(function(){
    $("form input").css("border", "2px dotted blue");
  });
  </script>
  <style>
  body { font-size:14px; }
  form { border:2px green solid; padding:2px; margin:0; 
         background:#efe; }
  div { color:red; }
  fieldset { margin:1px; padding:3px; }
  </style>
</head>
<body>
  <form>
    <div>Form is surrounded by the green outline</div>
    <label>Child:</label>
    <input name="name" />
    <fieldset>
      <label>Grandchild:</label>
      <input name="newsletter" />
    </fieldset>
  </form>
  Sibling to form: <input name="none" />
</body>
</html>

  $("form input").css("border", "2px dotted blue");

将匹配form元素下所有的input元素,并对满足条件的input元素加上样式:

<input name="name" />
<input name="newsletter" />

分享到:
评论

相关推荐

    jquery CSS和xpath选择器.pdf

    三、jQuery选择器的使用技巧 - 对于不完全支持CSS3的浏览器,jQuery的选择器引擎提供了良好的兼容性,使得开发者可以放心使用CSS3选择器。 - 使用`:not()`选择器可以方便地排除某些元素,实现反向选择。 - `E F`和`E...

    jquery CSS和xpath选择器.docx

    jQuery CSS和XPath选择器是网页开发中非常重要的工具,它们使得在JavaScript中选取DOM元素变得更加高效和方便。jQuery库对CSS选择器提供了全面的支持,包括CSS1、CSS2和CSS3的语法,同时,还引入了一些自定义的选择...

    关于jquery的多个选择器的使用示例

    jQuery支持多种CSS选择器,包括ID选择器(#id)、类选择器(.class)、元素选择器(tagname)等,以及组合选择器,如:交集选择器(E F,表示同时匹配E和F的元素)、并集选择器(E,F,表示匹配E或F的元素)和后代...

    jQuery Selectors Refcard

    位置选择器主要用来根据元素在 DOM 中的位置来筛选元素,如前面提到的 `E + F` 和 `E ~ F` 等。 #### 匹配集合方法 jQuery 提供了一些方法来处理通过选择器获取到的元素集合,这些方法包括但不限于: - **`.add()...

    jQuery选择

    ### jQuery选择器详解 #### 一、通过位置选择元素 在使用jQuery时,我们经常会遇到根据元素的位置来进行选择的情况。接下来我们将对几种基于位置的选择器进行详细的解释。 1. **`:first`**:此选择器选取指定上下...

    jqueryonline_final

    《jQuery选择器:掌握网页元素操控的关键》 在前端开发领域,jQuery因其强大的功能和简洁的语法而备受青睐。作为一款流行的JavaScript库,jQuery极大地简化了HTML文档遍历、事件处理、动画以及Ajax交互等操作。本文...

    锋利的jquery(学习笔记)

    【jQuery选择器】 jQuery的选择器分为四类: 1. **基本选择器**:`$(‘#idname’)`, `$(‘.classname’)`, `$(‘p’)`, `$(‘*’)`, 组选择器如`$(‘#idname,.classname,divname,divname.classname p’)` 2. **层次...

    jquery实现多附件上传

    2. **jQuery选择器和事件**:使用jQuery选择器定位到文件输入元素,然后绑定`change`事件,当用户选择文件后触发处理函数。例如,`$('input[type=file]').on('change', function() {...})`。 3. **Ajax上传**:通过...

    JQuery学习笔记

    - **后代选择器**:`E F` 选择E元素内的F元素,如 `#links a`。 - **通配选择符**:`*` 选择所有元素,如 `* { font-size: 14px; }`。 3. **JQuery 选择器**: - **基本选择器**:包括 `#id`(ID选择器)、`....

    Jquery学习文档

    层次选择器如`$("E F")`和`$("parent&gt;child")`可以用来定位元素间的层级关系。过滤选择器如`:first`、`:last`、`:not(selector)`、`:even`和`:odd`则可以根据特定条件筛选元素。内容过滤选择器如`:contains(text)`、...

    jquery 选择符

    #### 四、利用 jQuery 自定义的选择器进行选择 **4.1 :button** - **作用**:选择任何按钮类型的元素,包括 `&lt;input type="submit"&gt;` 等等。 - **示例**:`:button` 选择所有按钮元素。 **4.2 :checkbox** - **...

    一个jQuery表单时间选择jQueryTimepicker

    接着,在文档加载完成后,通过jQuery选择器找到该元素并调用`timepicker()`方法。 ```javascript $(document).ready(function() { $('#timePickerExample').timepicker(); }); ``` **3. 自定义配置** jQuery ...

    了解了这些才能开始发挥jQuery的威力

    jQuery的选择器基于CSS选择器,并且支持更多的高级选择器。 ##### 1. 基本选择器 - `$(‘*’)`:匹配页面上所有元素。 - `$(‘#id’)`:匹配具有指定ID的元素。 - `$(‘.class’)`:匹配具有指定类名的所有元素。 ...

    jQuery Context Menu - jQuery上下文菜单插件

    selector: '#myElement', // 选择器 items: { // 菜单项对象 "item1": {name: "菜单项1", icon: "edit"}, "item2": {name: "菜单项2", callback: function(){ alert('选择了菜单项2'); }}, "separator1": "---...

    jquery 制作可拖拽的div实例

    主要涉及的知识点包括:jQuery的选择器、事件绑定(`mousedown`、`mousemove`和`mouseup`)、DOM操作(`offset()`和`offset({ left: ..., top: ... })`)以及鼠标坐标计算。通过理解并应用这些技术,你可以创建出更...

    JQuery(A~Z)教程

    jQuery扩展了许多CSS3选择器,如`:first`, `:last`, `:even`, `:odd`, `:contains()`, `:input`, `:visible`, `:hidden`等,增强了选择元素的能力。 ### T - Traversing jQuery的遍历方法如`.find()`, `.closest()...

    jQuery-UI和jsPlumb实现拖拽连接模型demo下载

    jQuery-UI是基于jQuery的用户界面库,提供了多种UI组件,如对话框、滑块、日期选择器等。它简化了创建交互式网页的过程,使得开发者可以快速地添加各种UI元素并调整样式。jQuery-UI的核心是其强大的事件处理和动画...

    jquery读取本地文件和年、月、日联动

    这个案例中的"jquery读取本地文件和年、月、日联动"技术主要涉及到jQuery库的使用,以及日期选择器的设计,特别适用于考勤系统。以下是关于这个主题的详细解释: **jQuery读取本地文件** jQuery是一个强大的...

    jquery虚拟键盘插件jqkeyboard

    2. **初始化插件**:在页面加载完成后,通过jQuery选择器找到需要添加虚拟键盘的元素,然后调用jqKeyboard插件。 ```javascript $(document).ready(function() { $("#inputElement").jqKeyboard(); }); ``` 3...

    锋利的jQuery第2版源码

    7. **兼容性与性能优化**:jQuery致力于跨浏览器兼容性,书中会讨论如何确保代码在不同浏览器中运行一致,以及如何通过优化选择器、缓存DOM引用等方法提升性能。 8. **实战应用**:书中可能会包含实际项目中的案例...

Global site tag (gtag.js) - Google Analytics