the purpose: write less. do more   写得少,做更多

jquery 基本选择器,

  $("p ,div ")匹配所有的P元素和DIV元素 ,

  $("h1#chapter1")匹配id属性值为chapter1的h1的元素。

jquery 层级选择器

<body>
<h1>正确的认知是<em>非常</em>重要的!</h1>
<em>去看看吧!</em>
<body>

$("body em").css("color","red") :现在两个em元素的内容都是红色,因为两个em都是body的后代

$("body > em").css("color","red"): 现在只有第二个em元素才会显示为红色,因为只有它是body元素的直接子元素

$("h1 > em").css("color","red") :现在只有第一个em元素才会显示为红色,因为只有它是h1元素的子元素

$("h1 + em").css("color","red") : 现在只有第二个em 元素才会显示为红色,因为它是h1元素的相邻同辈元素

$("div ~ p").css("background-color","green") 匹配div中所有子元素为p的背景色为绿色

Jquery 属性选择器

$('h1[title]') 匹配那些指定了title属性的h1元素

$('h1[class="example"]') 匹配所有指定class属性的属性值为example的h1元素

$('span[title="note"][lang="zh-CN"]')  匹配那此span元素其title属性设置为note而lang属性设置为zh-CN

jquery 子元素过滤

E:first-child 匹配任何html元素E,但元素E必须是它的父节点的第一个子节点元素,

E:last-child  匹配任何html元素E,但元素E必须是它的父节点的最一个子节点元素

E:nth-child  匹配任何html元素E,但元素E必须是它的父节点的第n个子节点元素,$("ul li:nth-child(3)")匹配Ul元素下第3个子元素,参数可是整数负值,0 或正值

E:only-child 匹配任何html元素E,但元素E必须是它的父节点的唯一子节点元素

Jquery note的更多相关文章

  1. 抛弃jQuery:DOM API之操作元素

    原文链接:http://blog.garstasio.com/you-dont-need-jquery/dom-manipulation/ 我的Blog:http://cabbit.me/you-do ...

  2. 原生JS替代jQuery的各种方法汇总

    前端发展很快,现代浏览器原生 API 已经足够好用.我们并不需要为了操作 DOM.Event 等再学习一下 jQuery 的 API.同时由于 React.Angular.Vue 等框架的流行,直接操 ...

  3. jQuery与原生JS相互转化

    前端发展很快,现代浏览器原生 API 已经足够好用.我们并不需要为了操作 DOM.Event 等再学习一下 jQuery 的 API.同时由于 React.Angular.Vue 等框架的流行,直接操 ...

  4. Using The jQuery Migrate Plugin

    jQuery( html [, ownerDocument ] )Returns: jQuery Description: Creates DOM elements on the fly from t ...

  5. 原生js替换jQuery各种方法-中文版

    原文https://github.com/nefe/You-D... 原生JS与jQuery操作DOM对比 You Don't Need jQuery 前端发展很快,现代浏览器原生 API 已经足够好 ...

  6. You-Dont-Need-JQuery (你不需要JQuery)

    看完这篇文章我才觉得真的要用JQuery ,因为实在是有些地方设计的使用太复杂了, document.querySelector() 和 Document.querySelectorAll 的确是很方 ...

  7. 原生 JavaScript 代替 jQuery【转】

    目录 用原生JavaScript代替jQuery Query Selector CSS & Style DOM Manipulation Ajax Events Utilities Promi ...

  8. Understand JavaScript Callback Functions and Use Them

    In JavaScript, functions are first-class objects; that is, functions are of the type Object and they ...

  9. note.js 引用jQuery,

    1.安装jQuery npm install jquery 在自己的项目目录里面打开cmd进行安装 2.下面直接在js文件里面引用jQuery //调用jQuery来操作页面 const jsdom ...

随机推荐

  1. (easy)LeetCode 217.Contains Duplicate

    Given an array of integers, find if the array contains any duplicates. Your function should return t ...

  2. Isilon OneFS Simulator Install Guide

    Isilon build for storage data Use VMware converter to convert node1 to ESX(参考silon_OneFS_Simulator_I ...

  3. U-boot 之TFTP服务器配置

    一.PC端配置1.关闭防火墙  [root@gliethttp root]# /etc/init.d/iptables stop2.使用setup启动tftp  [root@gliethttp roo ...

  4. Caught exception while loading file struts-default.xml 错误

    严重: Exception starting filter struts2 Caught exception while loading file struts-default.xml - [unkn ...

  5. iOS UILabel详解

    1.创建 CGRect rect = CGRectMake(100, 200, 50, 50); UILabel *label = [[UILabel alloc] initWithFrame:rec ...

  6. VISUAL STUDIO 2008 WINDOWS FORM项目发布生成安装包详解(转)

    转自:http://www.cnblogs.com/killerofyang/archive/2012/05/31/2529193.html Visual Studio 2008 Windows Fo ...

  7. JavaScript == VS ===

    引用自  http://fxk2006.iteye.com/blog/768260 ==   equality 等同,两边值类型不同的时候,要先进行类型转换,再比较. === identity 恒等, ...

  8. linux 系统启动流程

    原著资料网址:http://wenku.baidu.com/view/414127fdf705cc1755270997.html (版权归原作者所有) Linux系统的启动分5个阶段,每个阶段都完成不 ...

  9. idea 破解服务器

    idea 最新破解服务器 http://idea.iteblog.com/key.php

  10. tornado框架之路三之ajax

    一.ajax 1.传统的Web应用 一个简单操作需要重新加载全局数据 2.AJAX AJAX即“Asynchronous Javascript And XML”(异步JavaScript和XML),是 ...