`
zhengxuezhou
  • 浏览: 151816 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

jQuery小结

    博客分类:
  • web
阅读更多
第一章:选择器

一、基本选择器

1、单选择器

$(“标签名”)

$(“#id名”)

$(“.类名”)

2、多选择器

$(“*”)                          //所有元素

$(“标签名,标签名.类名,…”)        //将每一个选择器匹配到的元素合并后一起返回



二、层级选择器

1、$(“祖先标签 后代标签”)     //祖先标签下匹配所有的后代标签

如:$(“form input”)

2、$(“父标签>子标签”)         //父标签下匹配所有的子标签

如:$(“form>input”)

3、$(“起始标签+要选的标签”)  //起始标签后,要选的标签(第一个必须紧跟起始标签)

4、$(“起始标签~要选的同辈标签”)  //起始标签后,要选的标签(必须与父标签同辈)



三、简单选择器:

1、$(“标签:first|last”)          //匹配第一个|最后一个元素

2、$(“标签:not(选择器)”)    //去除所有与给定选择器匹配的元素

如:$("input:not(:checked)")

3、$(“标签:even|odd”)         //匹配索引为偶数|奇数的元素 (索引从0开始)

4、$(“标签:eq|gt|lt(n)”)        //匹配索引=|>|<n的元素

5、$(“:header”)                    //匹配如h1、h2、h3之类的标题元素

如:$(":header").css("background", "#EEE");

6、$(“标签:animated”)         //匹配所有正在执行动画效果的元素



四、内容选择器

1、$(“标签:contains(text)”)   //匹配包含指定文本的元素

2、$(“标签:empty”)                //匹配不包含任何子元素或文本为空的元素

3、$(“标签:has(选择器)”)      //匹配含有选择器匹配的元素的元素

如:$("div:has(p)").addClass("test");

4、$(“标签:parent”)       //匹配含有子元素或文本的元素(匹配所有为父亲的元素)



五、可见性选择器

$(“标签:hidden”)          //匹配所有不可见元素,包括<input type=”hidden”/>

$(“标签:visible”)         //匹配所有可见元素



六、属性选择器

1、$(“标签[属性名]”)              //匹配包含给定属性名的元素

2、$(“标签[属性名=‘属性值’]”)   //匹配“属性名=‘属性值’”的元素

$(“标签[属性名!=‘属性值’]”)  //匹配“属性名!=‘属性值’”的元素

3、$(“标签[属性名^=‘属性值’]”)  //匹配以给定的属性值开头的元素

$(“标签[属性名$=‘属性值’]”)  //匹配以给定的属性值结尾的元素

4、$(“标签[属性名*=‘属性值’]”)  //匹配包含给定的属性值的元素

5、$(“标签[[选择器1][选择器2]…]”)   //以上各条件的组合



七、子元素选择器:为每一个父元素匹配子元素

1、$(“标签:nth-child(n|even|odd)”)   

//匹配父元素下第n|奇数|偶数个元素

注:$(“标签:eq(n)”)只匹配一个元素;索引n,从0开始

    $(“标签:nth-child(n)”)为每一个父元素匹配子元素;个数n,从1开始

2、$(“标签:first-child”)  //为每一个父元素匹配第一个子元素

$(“标签:last-child”)   //为每一个父元素匹配最后一个子元素

3、$(“标签:only-child”)   //如果父元素只有唯一的子元素,该子元素将会被匹配



八、表单选择器:匹配form表单标签下的元素

$(“:input”)   //匹配所有input元素

$(“:text”)        //匹配所有<input type=“text”/>元素

$(“:password”)    //匹配所有<input type=“password”/>元素

$(“:radio”)   //匹配所有<input type=“radio”/>元素

$(“:checkbox”)    //匹配所有<input type=“checkbox”/>元素

$(“:submit”)  //匹配所有<input type=“submit”/>元素

$(“:image”)   //匹配所有<input type=“image”/>元素

$(“:reset”)   //匹配所有<input type=“reset”/>元素

$(“:button”)  //匹配所有<input type=“button”/>元素

$(“:file”)        //匹配所有<input type=“file”/>元素



九、对象属性选择器

1、$(“标签:enable|disable”)   //匹配所有可用|不可用元素

2、$(“标签:checked”)  //匹配所有选中的单、复选框元素。如$(input:checked)

3、$(“标签:selected”) //匹配所有选中的选项元素。如$(select option:selected)



内容太多,以下各章略……

第二章 属性

第三章 筛选

第四章 文档处理

第五章 CSS

第六章 事件

第七章 效果

第八章 Ajax

第九章 核心

第十章 工具


分享到:
评论

相关推荐

    jQuery小结.rar

    《jQuery小结》 在Web开发领域,jQuery是一款极为重要的JavaScript库,它简化了DOM操作、事件处理、动画效果和Ajax交互。本篇文章将深入探讨jQuery的核心知识点,包括选择器与筛选方法、样式操作、效果展示、DOM...

    jQuery1.4.1 小结

    **jQuery1.4.1 小结** jQuery 是一个广泛使用的JavaScript库,它极大地简化了JavaScript的DOM操作、事件处理、动画制作以及Ajax交互。在本文中,我们将深入探讨jQuery 1.4.1版本的一些核心特性、改进和常用API。 #...

    jquerymobile经验小结

    ### jQuery Mobile 经验小结 #### 一、概述 jQuery Mobile 是一款基于 HTML5 的移动设备框架,它为开发者提供了构建响应式网站、应用程序的能力。通过使用 jQuery Mobile,可以轻松地创建适用于不同屏幕尺寸的网页...

    Jquery.validate表单验证小结

    ### Jquery.validate表单验证详解 #### 一、引言 在Web开发中,表单验证是确保数据质量的关键步骤。传统的JavaScript表单验证方法往往冗长且难以维护,而jQuery Validate插件则以其简洁、高效及易于扩展的特性成为...

    jquery 用法小结

    jQuery 动画jQuery 提供了多种方法来创建动画效果,如 fadeToggle(), fadeIn(), fadeOut(), slideToggle(), slideUp(), slideDown() 等。例如,要淡入淡出一个段落,我们可以这样编写代码: $("#fade").click...

    Jquery使用小结

    ### Jquery使用小结 #### 一、Jquery简介与基础使用 JQuery 是一款流行的 JavaScript 库,它简化了 HTML 文档遍历、事件处理、动画以及 Ajax 交互等开发工作。通过本文,我们将对 JQuery 的基础知识进行总结,并...

    jQuery插件开发的五种形态小结

    总结来说,jQuery插件开发中的五种形态小结通过一系列的示例和说明,为开发者展示了如何创建一个高效、可维护的插件。这五个形态涉及到了代码的独立性、链式操作、插件的可配置性、生命周期的管理、无冲突处理以及...

    jquery取单选,复选,下拉小结

    这篇博客"jquery取单选,复选,下拉小结"是关于如何使用jQuery来操作网页中的单选按钮(radio)、复选框(checkbox)以及下拉列表(select)的选择项。下面我们将详细探讨这些知识点。 首先,我们来讨论如何使用...

    JQuery可编辑表格小结.docx

    《JQuery可编辑表格小结》 在网页开发中,数据展示往往需要用到表格,而让表格中的数据可编辑则能极大地提升用户体验。JQuery库以其简洁的API和强大的功能,成为了实现这一目标的理想选择。本文将对使用JQuery构建...

    jquery使用经验小结

    在本文中,作者通过个人使用jQuery的实践经验,总结出了五个重要知识点,让我们一起来探讨一下这些知识点的具体内容。 1. jQuery对象与原生DOM对象的互转...希望本文作者的经验小结,能为你的jQuery学习之旅带来便利。

    jQuery学习小结之基础篇

    NULL 博文链接:https://chenzheng8975.iteye.com/blog/1616594

    这些年、我收集的JQuery代码小结

    《这些年,我收集的JQuery代码小结》 在网页开发中,jQuery作为一个强大的JavaScript库,极大地简化了DOM操作、事件处理以及动画效果的实现。本文将总结一些实用的jQuery代码片段,帮助开发者提高效率,优化代码...

    Jquery操作Ajax方法小结

    jQuery是一个快速、小巧的JavaScript库,它封装了JavaScript的动画效果和Ajax等技术,简化了这些技术在使用时的操作。在现代Web开发中,AJAX技术用于实现页面的异步更新,jQuery通过提供的一系列AJAX相关方法,极大...

    jquerydemo

    11. 小结1 12. 选择器练习 13. 创建和插入节点 14. 重写 JS 实验之分类添加内容 15. 删除及清空节点 16. 重写 JS 实验之员工管理 17. 克隆和替换节点 18. 包裹节点 19. html() 方法 & val() 方法 20. 小结2 21. CSS ...

    JQuery选择器特辑 详细小结

    ### JQuery选择器特辑详细小结 #### 一、基本选择器 基本选择器是JQuery中最基础也是最常用的选择器,通过元素的ID、类名(Class)和标签名等来查找DOM元素。基本选择器主要包括: - ID选择器:通过元素ID来选取...

    尚硅谷jQuery视频教程(25集)

    尚硅谷_佟刚_jQuery_第一天小结【】12.尚硅谷_佟刚_jQuery_选择器的练习【】13.尚硅谷_佟刚_jQuery_创建节点及插入节点【】14.尚硅谷_ 资源太大,传百度网盘了,链接在附件中,有需要的同学自取。

    jquery 注意事项与常用语法小结

    jQuery,作为一款广泛使用的JavaScript库,提供了丰富的API和简洁的语法来操作DOM、处理事件以及实现动画效果。这里我们将深入探讨jQuery的一些注意事项和常用语法,这对于任何正在学习或使用jQuery的人来说都是十分...

    2013年优秀jQuery插件整理小结

    今天为大家推荐的是2013年的第一期,在这期里面十个jQuery插件涵盖了响应式的网格布局插件、图片放大插件、表单元素中自定义select插件,google 地图插件、文件拖放上传插件、tooltip提示插件、3D旋转菜单等等

    jQuery树形控件zTree使用小结

    jQuery树形控件zTree是一款基于jQuery的多功能树形控件插件,它广泛应用于Web开发中,提供了一个方便的方式来实现树状数据结构的展示与管理。zTree具备优异的性能,支持灵活的配置选项,并能够与多种功能组合使用,...

Global site tag (gtag.js) - Google Analytics