一.jQuery版本兼容

jQuery版本2以上不支持IE6,7,8浏览器。

如果需要支持IE6/7/8，那么请选择1.9

同样还可以通过条件注释在使用IE6/7/8时只包含进1.9

 <!--[if lt IE ]>

     <script src="jquery-1.9.0.js"></script>

 <![endif]-->

 <!--[if gte IE ]><!-->

     <script src="jquery-2.0.0.js"></script>

 <!--<![endif]-->

 

1.HTML的元素选取

2.HTML的元素操作

3.HTML DOM遍历和修改

4.js特效和动画效果

5.css操作

6.HTML事件操作

7.ajax异步请求方式

三.选择器

通过$(":button")可以选取所以type="button"的<input>元素和<button>元素，如果去掉冒号，$("button")只能获取<button>元素。

 <!DOCTYPE html>

 <html>

 <head>

 <meta charset="utf-8">

 <script src="https://cdn.bootcss.com/jquery/1.10.2/jquery.min.js">

 </script>

 <script>

     $(document).ready(function(){

         $("#test1").click(function(){

             $("button").hide();

         });

         $("#test2").click(function(){

             $(":button").hide();

         });

     });

 </script>

 </head>

 <body>

     <p id="test1">点进这里测试  <b>button</b></p>

     <p id="test2">点进这里测试 <b>:button</b></p>

     <button>Button 按钮</button>

     <input type="button" value="Input 按钮">

 </body>

 </html>

1.基本选择器

$("#id")            //ID选择器

$("div")            //元素选择器

$(".classname")     //类选择器

$(".classname,.classname1,#id1")     //组合选择器

2.层次选择器

 $("#id>.classname ")    //子元素选择器

$("#id .classname ")    //后代元素选择器

$("#id + .classname ")    //紧邻下一个元素选择器

$("#id ~ .classname ")    //兄弟元素选择器

3.过滤选择器(重点)

$("li:first")    //第一个li

$("li:last")     //最后一个li

$("li:even")     //挑选下标为偶数的li

$("li:odd")      //挑选下标为奇数的li

$("li:eq(4)")    //下标等于4的li

$("li:gt(2)")    //下标大于2的li

$("li:lt(2)")    //下标小于2的li

$("li:not(#runoob)") //挑选除 id="runoob" 以外的所有li

3.2内容过滤选择器

$("div:contains('Runob')")    // 包含 Runob文本的元素

$("td:empty")                 //不包含子元素或者文本的空元素

$("div:has(selector)")        //含有选择器所匹配的元素

$("td:parent")                //含有子元素或者文本的元素

3.3可见性过滤选择器

$("li:hidden")       //匹配所有不可见元素，或type为hidden的元素

$("li:visible")      //匹配所有可见元素

3.4属性过滤选择器

$("div[id]")        //所有含有 id 属性的 div 元素

$("div[id='123']")        // id属性值为123的div 元素

$("div[id!='123']")        // id属性值不等于123的div 元素

$("div[id^='qq']")        // id属性值以qq开头的div 元素

$("div[id$='zz']")        // id属性值以zz结尾的div 元素

$("div[id*='bb']")        // id属性值包含bb的div 元素

$("input[id][name$='man']") //多属性选过滤，同时满足两个属性的条件的元素

3.5状态过滤选择器

$("input:enabled")    // 匹配可用的 input

$("input:disabled")   // 匹配不可用的 input

$("input:checked")    // 匹配选中的 input

$("option:selected")  // 匹配选中的 option

4.表单选择器

$(":input")      //匹配所有 input, textarea, select 和 button 元素

$(":text")       //所有的单行文本框，$(":text") 等价于$("[type=text]")，推荐使用$("input:text")效率更高，下同

$(":password")   //所有密码框

$(":radio")      //所有单选按钮

$(":checkbox")   //所有复选框

$(":submit")     //所有提交按钮

$(":reset")      //所有重置按钮

$(":button")     //所有button按钮

$(":file")       //所有文件域

jQuery学习笔记一的更多相关文章

  1. jQuery学习笔记(一)jQuery选择器

    目录 jQuery选择器的优点 基本选择器 层次选择器 过滤选择器 表单选择器 第一次写博客,希望自己能够长期坚持,以写博客的方式作为总结与复习. 最近一段时间开始学习jQuery,通过写一个jQue ...

  2. jQuery 学习笔记

    jQuery 学习笔记   一.jQuery概述    宗旨: Write Less, Do More.    基础知识:        1.符号$代替document.getElementById( ...

  3. jQuery学习笔记（一）：入门

      jQuery学习笔记(一):入门 一.JQuery是什么 JQuery是什么?始终是萦绕在我心中的一个问题: 借鉴网上同学们的总结,可以从以下几个方面观察. 不使用JQuery时获取DOM文本的操 ...

  4. jQuery学习笔记 - 基础知识扫盲入门篇

    jQuery学习笔记 - 基础知识扫盲入门篇 2013-06-16 18:42 by 全新时代, 11 阅读, 0 评论, 收藏, 编辑 1.为什么要使用jQuery? 提供了强大的功能函数解决浏览器 ...

  5. JQuery学习笔记——层级选择器

    JQuery学习笔记--层级选择器 上一篇学习了基础的五种选择,分别是id选择器,class选择器,element选择器,*选择器 和 并列选择器.根据手册大纲,这篇学习的是层级选择器. 选择器: 1 ...

  6. jQuery学习笔记之Ajax用法详解

    这篇文章主要介绍了jQuery学习笔记之Ajax用法,结合实例形式较为详细的分析总结了jQuery中ajax的相关使用技巧,包括ajax请求.载入.处理.传递等,需要的朋友可以参考下 本文实例讲述了j ...

  7. jQuery 学习笔记：jQuery 代码结构

    jQuery 学习笔记:jQuery 代码结构 这是我学习 jQuery 过程中整理的笔记,这一部分主要包括 jQuery 的代码最外层的结构,写出来整理自己的学习成果,有错误欢迎指出. jQuery ...

  8. jQuery学习笔记之插件开发（4）

    jQuery学习笔记之插件开发(4) github源码地址 插件:了让原有功能的增强. 1.插件的种类(3种):局部.全局.选择器插件 1.1封装对象方法的插件 这种类型的插件是把一些常用或者重复使用 ...

  9. jQuery学习笔记之jQuery的Ajax（3）

    jQuery学习笔记之jQuery的Ajax(3) 6.jQuery的Ajax插件 源码地址: https://github.com/iyun/jQueryDemo.git ------------- ...

  10. jQuery学习笔记之DOM操作、事件绑定（2）

    jQuery学习笔记之DOM操作.事件绑定(2) --------------------学习目录------------------------ 4.DOM操作 5.事件绑定 源码地址: https ...

随机推荐

  1. sql优化原则与技巧

    加快sql查询是非常重要的技巧,简单来说加快sql查询的方式有以下几种:一.索引的引用 1.索引一般可以加速数据的检索速度,加速表与表之间的链接,提高性能,所以在对海量数据进行处理时,考虑到信息量比较 ...

  2. Md2All

    微信公众号:颜家大少欢迎关注我,一起学习,一起进步!目前,知到 Md2All 的朋友还很少,如果你觉得有帮助,希望能告诉身边有需要的朋友. 谢谢! Md2All 简介 一个Markdown在线转换工具 ...

  3. timeline自适应时间轴

    近期项目一直有类似QQ空间那样的时间轴,来展示公司新闻动态,或者流程之类的设计UI. 每每出现,不以为然,这次总结了下,精简下 ================= ================== ...

  4. 设计模式成长记（一） 抽象工厂模式（Abstract Factory）

    目录 定义 UML类图 参与者 编写代码 特点 定义 提供一个创建一系列相关或相互依赖的对象的接口,而无需指定具体的类. 使用频率: UML类图 参与者 AbstractFactory:声明一个创建抽 ...

  5. Linux 常见命令示例【一】

    查看端口占用 [查看目前系统上已在监听的网络联机及其pid netstat –tlnp] 文件挂载 Linux与windows文件传输(三方软件:secureCRT, WINscp) 1)sftp S ...

  6. SpringMVC handleMapping 处理器映射器 属性清单

    映射器的属性清单 defaultHandler         在映射与所有处理器都不匹配的情况下,指定默认的处理器(处理器即你定义的Controller(action)类) order        ...

  7. JavaScript（四）操作符

      6种表达式 原始表达是  初始化表达式 函数定义表达式 函数调用表达式 属性访问表达式 对象创建表达式 操作符 操作符的优先级 属性访问[] .  >  一元操作符 >  */ > ...

  8. 使用docker+jenkins构建nodejs前端项目

    前文使用Docker搭建Jenkins+Docker持续集成环境我们已经搭建了基于docker+jenkins的持续集成环境,并构建了基于maven的项目.这一节,我们继续扩展功能,增加对Nodejs ...

  9. Ubuntu 设置内核版本的GRUB默认启动

    注:我只是一只小小的搬运工.这篇文章内容摘自: https://www.calazan.com/how-to-set-an-older-kernel-version-as-the-default-in ...

  10. Spring Boot快速入门（四）：使用jpa进行数据库操作

    原文地址:https://lierabbit.cn/articles/5 添加依赖 新建项目选择web,JPA,MySQL三个依赖 对于已存在的项目可以在bulid.gradle加入,spring b ...