文档章节

jQuery学习笔记之JavaScript脚本库和元素选择器研究[图]

 原创小博客
发布于 2018/08/06 16:21
字数 1641
阅读 8
收藏 3

jQuery学习笔记之JavaScript脚本库和元素选择器研究[图]
jQuery是一套JavaScript脚本库,相当于Java的类库,将一些工具方法或者对象方法封装在类库中,方便用户使用。
工厂函数指的是这些内建函数都是类对象,当你调用他们时,实际就是创建了一个类实例。
一.jQuery基本选择器包括:ID选择器,元素选择器,类名选择器,多种匹配条件选择器,通配符选择器。
1.ID选择器(#id)
jQuery中的id选择器相当于JavaScript中的document.getElementById()方法;
JavaScript只能调用DOM方法,jQuery可以调用DOM方法,也可以调用jQuery封装的方法。
页面中如果出现了两个相同的id的属性值,程序运行时会报出JS运行错误的对话框,所以要保证id属性值唯一。
2.元素选择器(element)
元素选择器是根据元素名称匹配相应的元素,元素选择器匹配的是一组元素。它是jQuery包装集,是一组Object对象,需要使用索引器来获取单独的文本信息。
eq()和 get(),默认都是从0开始计数
eq()方法返回的是一个jQuery包装集,所以只能调用jQuery方法
get()方法返回的是一个DOM对象,所以调用DOM对象的方法
3.类名选择器(.class)
类名选择器是通过元素拥有的CSS类的名称查找匹配的DOM元素

jQuery学习笔记之JavaScript脚本库和元素选择器研究[图]
4.复合选择器(select1,select2,select3,selectN)
复合选择器将多个选择器组合在一起,用逗号分隔开,只要符合任何一个筛选条件就会匹配,返回的是一个jQuery包装集,利用索引器可以获取集合中的对象。
5.通配符选择器(*)
二.层级选择器
层级选择器就是根据页面上的DOM元素之间父子关系作为匹配的筛选条件。
jQuery提供的层级选择器的有:
1.ancestor descendan选择器
用于给定的祖先元素下匹配的所有后代元素
2.parent  > child选择器
该选择器只能选择父元素下直接的子元素
3.prev+next选择器
用于匹配所有紧接在prev后面的next元素,pre与next是两个相同的元素
4.prev~sibling选择器
用于匹配prev之后的所有sibling元素,其中prev和sibling是两个同辈元素
三.过滤选择器
过滤选择器包括
1.简单过滤器
以冒号开头,通常实现简单过滤效果的过滤器
2.内容过滤器
通过DOM元素包含的文本内容以及是否含有匹配的元素进行筛选
:contains(text)匹配包含给定文本的元素
:empty匹配不包含子元素或者文本的元素
:has(selector)匹配含有选择器匹配元素的元素
:parent匹配含有子元素或者文本的元素
3.可见性过滤器
可见性过滤器就是利用元素的可见状态匹配元素,因此,可见性过滤器也有两种,一种是匹配所有可见元素的:visible过滤器,另一种是匹配不可见元素的:hidden过滤器
在应用:hidden过滤器的时候,display属性是none以及input元素的type属性为:hidden的元素都会被匹配到
4.表单对象的属性过滤器
表单对象的过滤器是通过表单元素的状态属性匹配元素,包括:
1.checked过滤器:匹配所有被选中的元素
2.disabled过滤器:匹配所有不可用的元素
3.enabled过滤器:匹配所有可用的元素
4.selected过滤器:匹配所有选中的option元素
5.子元素选择器
子元素选择器就是筛选给定某个元素的子元素,具体过滤条件由选择器的种类而定
:first-child匹配所有给定元素的第一个元素
:last-child匹配所有给定元素的最后一个元素
:only匹配元素中唯一的子元素
:nth-child匹配父元素下的第N个子或奇偶元素,index从1开始,而不是从0开始
四.属性选择器
属性选择器就是通过元素的属性作为过滤条件进行筛选
五.表单选择器
表单选择器就是匹配经常在表单中出现的元素,但是匹配的元素不一定在表单中。
jQuery方法:
val():获取文本框的值
ready():当页面元素载入完成时就自动执行程序,自动为按钮绑定单击事件
html():设置元素的文本内容
addClass():为元素添加CSS类
removeClass():移除元素的CSS类
java同步容器类的问题,vector等:
大家都知道java中的同步容器类是线程安全的,但是在某些情况下可能需要额外的客户端加锁来保护复合操作。容器上的常见的复合操作是:穆斯林的葬礼读书笔记(http://www.simayi.net/dushubiji/895.html)心得感悟,迭代(遍历完容器中的所有容器),跳转(根据指定顺序找到当前元素的下一个个元素)以及条件运算 。最常见的例如”若没有则添加“(检查map中是否存在key值,不存在再添加)。
在同步容器类中,这些复合操作在没有客户端加锁的情况下仍然是线程安全的,但当其他线程并发地修改容器时,他们可能出现意料之外的行为。
例如以下vector的getLast和setLast操作。虽然大家都知道vector是线程安全的,但是在VectorDemo中getLast不是线程安全的,因为list.size()和list,get()这两个对list的操作不能保证他们俩的原子性,list.size()的结果在执行list.get()时可能已经发生状态了(被其他线程对list的remove所破坏)。让其变成线程安全的办法就是注释里的内容,就是锁住list。

© 著作权归作者所有

粉丝 13
博文 294
码字总数 671874
作品 0
宜昌
私信 提问
jQuery学习笔记--选择器和事件

以下内容参考 W3school 简书 你要是问我什么是jQuery 那可以这么两句话概括: jQuery 是一个 JavaScript 库。 jQuery 极大地简化了 JavaScript 编程。 要学jQuery最好有点javaScript的基础 ...

codingcoge
2018/05/17
0
0
JavaWeb05-HTML篇笔记(一)

1.1上次课内容回顾: JQuery: JQuery的概述:是一个轻量级的JavaScript的类库.对JS进行封装. 常见的JS的框架: JQuery的使用: JQuery的选择器:(*) JQuery实现效果: JQuery样式操作: JQuer...

我是小谷粒
2018/05/10
0
0
jQuery、ajax、JSON

最近在做项目的过程中,对于jQuery、ajax、JSON这三者的关系总是理不清楚,于是,在简单是使用,有了丁点的经验,于是对这三者的关系做了下研究: 1、jQuery : 以下来自百度百科 jQuery是一个...

伊人心
2018/12/28
0
0
从零开始学 Web 之 jQuery(一)jQuery的概念,页面加载事件

大家好,这里是「 从零开始学 Web 系列教程 」,并在下列地址同步更新...... github:https://github.com/Daotin/Web 微信公众号:Web前端之巅 博客园:http://www.cnblogs.com/lvonve/ CSDN...

fengdaoting
2018/07/04
0
0
jQuery是怎样工作的

介绍 jQuery是时下最为流行的JavaScript库。它使用CSS选择器样式语法获取文档对象模型(DOM)中的元素到已包装的对象集合中,然后使用jQuery方法操纵这些元素来达到不同的效果。尽管jQuery的使...

tsl0922
2012/08/08
2.5K
2

没有更多内容

加载失败,请刷新页面

加载更多

为什么说优秀架构师往往是一个悲观主义者?

阿里妹导读:18年前,200家企业由于在事故中信息系统遭到严重破坏而永远地关闭了。这样的事故引发了后人深思,对于工程师而言,不仅要求设计的系统足够强壮,还需要具备考虑失败的能力,当失...

阿里云云栖社区
13分钟前
0
0
时延敏感业务低概率超时问题分析

前言 作为阿里云底层提供的基础设施,内部的物理网络和许多网络产品在数据平面给客户的可操作性并不高,从一定程度上来说是个黑盒。当然,在传统的IDC环境,业务和物理网络之间也存在同样的隔...

阿里云官方博客
23分钟前
0
0
ServletContextListener在Tomcat中的配置问题

在带有监听器的servlet中,执行的顺序是这样的,首先建立servletListerner,然后运行,初始化ServletContext,然后监听ServletContext的变化,最后ServletContext被销毁,加ServletListener...

花漾年华
30分钟前
0
0
安全防护工具之:ClamAV

安全防护工具之:ClamAV 2018年10月02日 00:49:35 neo_will_mvp 阅读数 359 版权声明:精心研究,潜心学习,本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/qq_3346885...

linjin200
31分钟前
0
0
InnoDB索引

如果我们要去一本书中翻看某部分的内容,最简单的方法就是先翻到目录也就是“索引”部分,找到对应的页码,数据库也是如此。 本文以mysql为例来表述InnoDB 索引基础 在mysql中存储引擎先使用...

周慕云
38分钟前
1
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部