JQUERY1.9学习笔记之可见性过滤器(一) 隐藏选择器

【JQUERY1.9学习笔记之可见性过滤器(一) 隐藏选择器】的更多相关文章

JQUERY1.9学习笔记之可见性过滤器(一) 隐藏选择器

描述:选择所有隐藏的元素. jQuery( ":hidden" ) 例:显示出所有隐藏的div元素,并对隐藏的input元素计数. <!doctype html><html lang="en"> <head> <meta charset="utf-8"> <title>hidden demo</title> <style> div{ width:70px; hei…

JQUERY1.9学习笔记之可见性过滤器(二) 可见选择器

描述:选择所有可见的元素. 例:点击时让所有的可见的div元素变黄. <!doctype html><html lang="en"> <head> <meta charset="utf-8"> <title>visible demo</title> <style> div{ width:50px; height:40px; margin:5px; border:3px outset…

JQUERY1.9学习笔记之内容过滤器(四) parent选择器

描述:选择至少包含一个子节点的元素(一个标签或是文本). 例:找出所有有子元素的td标签,包含文本. <!doctype html><html lang="en"> <head> <meta charset="utf-8"> <title>parent demo</title> <style> td{ width:40px; background:green; } </styl…

JQUERY1.9学习笔记之内容过滤器(三) has选择器

描述:选择至少包含一个元素,匹配指定的标签的标签.jQuery( ":has(selector)" ) 例:给所有的div添加一个类"test",在他们中有一个段落. <!doctype html><html lang="en"> <head> <meta charset="utf-8"> <title>has demo</title> <style…

JQUERY1.9学习笔记之内容过滤器(一) 包含选择器

描述:选择包含指定文本的所有元素.jQuery( ":contains(text)" ) text:一串大小写敏感的文本. 例:找出所有包含"john"的div元素,并把他们标上下划线.(区分大小写) <!doctype html><html lang="en"> <head> <meta charset="utf-8"> <title>contains demo&l…

JQUERY1.9学习笔记之基本过滤器(十一) 奇数选择器

奇数选择器jQuery( ":odd" ) 例:匹配表格的奇数行. <!DOCTYPE html><html lang="zh-cn"><head> <meta charset="utf-8"> <title>odd demo</title> <style> table { background: #f3f7f5; } </style> <scr…

JQUERY1.9学习笔记之基本过滤器(十) 非选择器

非选择器jQuery( ":not(selector)" ) 例:找出所有input标签为非"checked"的,并且高亮其邻居元素span. <!DOCTYPE html> <html lang="zh-cn"> <head> <meta charset="utf-8"> <title>not demo</title> <style> <…

JQUERY1.9学习笔记之基本过滤器(九) 小于选择器

小于选择器 jQuery( ":lt(index)" ) jQuery( ":lt(-index)" ) 描述:选择所有小于指定下标的元素. <!DOCTYPE html><html lang="zh-cn"><head> <meta charset="utf-8"> <title>lt demo</title> <style> </st…

JQUERY1.9学习笔记之基本过滤器(七) 语言选择器

语言选择器 jQuery( ":lang(language)" ) 描述:选择所有用特定语言指定的标签. 根据标签指定语言的不同给标签上色. <!DOCTYPE html><html lang="zh-cn"><head> <meta charset="utf-8"> <title>header demo</title> <style> body { backgr…

JQUERY1.9学习笔记之基本过滤器(五) 大于选择器

大于选择器:jQuery( ":gt(index)" )jQuery( ":gt(-index)" ) 例:大于TD5 到TD8 用黄色背景,TD8用红色文字. <!DOCTYPE html><html lang="zh-cn"><head> <meta charset="utf-8"> <title>gt demo</title> <style&g…

JQUERY1.9学习笔记之基本过滤器(三)偶数选择器

偶数选择器 jQuery( ":even" ) 例:查询偶数个表格的行. <!DOCTYPE html><html lang="zh-cn"><head> <meta charset="utf-8"> <title>even demo</title> <style> table{ background:#eee; } </style> <scri…

JQUERY1.9学习笔记之基本过滤器(二) 等于选择器

等于选择器 :eq() 描述:选择与设定下标匹配的元素.jQuery( ":eq(index)" )jQuery( ":eq(-index)" ) <!DOCTYPE html><html lang="zh-cn"><head> <meta charset="utf-8"> <title>find the third td</title> <scri…

JQUERY1.9学习笔记之基本过滤器(一) 动态选择器

动态选择器:animated Selector 描述:当选择器运行时,选择动态进程中的所有元素.(对动态进程起作用) jQuery( ":animated" ) 注释::animated是jquery的一个扩展 <!DOCTYPE html><html lang="zh-cn"><head> <meta charset="utf-8"> <title>next siblings demo…

JQUERY1.9学习笔记之内容过滤器(二) 空元素选择器

描述:选择没有子元素(包括文本节点)的标签. jQuery(":empty") 与:parent相反. 例:找出所有为空的元素.(他们没有子元素或文本元素). <!doctype html><html lang="en"> <head> <meta charset="utf-8"> <title>empty demo</title> <style> td{text…

JQUERY1.9学习笔记之基本过滤器(十二) 根元素选择器

根元素选择器描述:选择文档的根节点元素.jQuery( ":root" ) 例:显示文档根节点标签名. <!DOCTYPE html><html lang="zh-cn"><head> <meta charset="utf-8"> <title>root demo</title> <style> </style> <script src=&qu…

JQUERY1.9学习笔记之基本过滤器(八) 最后元素选择器

最后元素选择器 jQuery( ":last" ) 描述:选择与之匹配的最后元素. 例:选择表格的最后一行. <!DOCTYPE html><html lang="zh-cn"><head> <meta charset="utf-8"> <title>last demo</title> <style> </style> <script src=&…

JQUERY1.9学习笔记之基本过滤器(六) 页眉选择器

页眉选择器jQuery( ":header" ) 描述:选择页眉的所有标签,如 h1,h2, h3 等. <!DOCTYPE html><html lang="zh-cn"><head> <meta charset="utf-8"> <title>header demo</title> <style> </style> <script src=&…

JQUERY1.9学习笔记之基本过滤器(四) 首元素选择器

首元素选择器:jQuery( ":first" ) <!DOCTYPE html><html lang="zh-cn"><head> <meta charset="utf-8"> <title>first demo</title> <style> td{ color:blue; font-weight:bold; } </style> <scri…

《jQuery权威指南》学习笔记之第2章 jQuery选择器

2.1 jQuery选择器概述 2.1.1 什么使选择器 2.1.2 选择器的优势: 代码更简单,完善的检测机制 1.代码更简单示例2-1 使用javascript实现隔行变色 <html> <head> <title>使用Javascript实现隔行变色</title> <style type="text/css"> body { font-size: 12px; text-align: center; }…

jQuery学习笔记之可见性过滤选择器

可见性过滤选择器是根据元素的可见和不可见状态来选择相应的元素. 显示隐藏的例子: <!DOCTYPE html> <html> <head> <script src="/jquery/jquery-1.11.1.min.js"></script> <script type="text/javascript"> $(document).ready(function(){ $("#hide…

JQUERY1.9学习笔记之属性选择器(二) 包含选择器

jQuery("[attribute*='value']") 描述:选择所有与给定值匹配的属性值的标签. 例:找出所有name属性包含"man"的input标签并且值设置一些文本. <!doctype html><html lang="en"> <head> <meta charset="utf-8"> <title>attributeContains demo<…

JQUERY1.9学习笔记之属性选择器(一) 前缀选择器

描述:选择指定属性值的元素,或者是以字符串开始其后跟随“-”符号的. jQuery( "[attribute|='value']" ) 例:查找出所有语言属性为en的链接. <!doctype html><html lang="en"> <head> <meta charset="utf-8"> <title>attributeContainsPrefix demo</title&…

JQUERY1.9学习笔记之层级选择器(四)

下一个邻居选择器(“prev ~ siblings”) 描述:选择所有"prev"后的邻居选择器,他们有相同的父节点. 注意:prev + next 与 prev ~ siblings 的作用范围不一样,前者的作用范围是与他直接相邻的元素,后者的范围是其后的所有邻居元素. <!DOCTYPE html><html lang="zh-cn"><head> <meta charset="utf-8">…

jquery1.9学习笔记之选择器(基本元素二)

类选择器(".class") 描述: 选择所有与给出类匹配的元素对于类选择器来说,jquery使用的是javascript原生的方法getElementByClassName() 例子: <!doctype html> <html lang='zh'> <head> <meta charset="utf-8"> <title>class demo</title> <style type=…

jquery1.9学习笔记之选择器(基本元素一)

所有选择器("*") 描述:选择所有元素注意:大多数情况下,这个选择器极其的慢,尤其是在作用于自身时. 例子: 查找文档中的每个元素.然后追加一个<script>或<link>元素到DOM里, 这个元素会被认为是可行的. <!doctype html> <html lang="zh"> <head> <meta charset="utf-8"> <title>a…

jquery1.9学习笔记之层级选择器(三)

下一个相邻选择器(“prev + next”) 描述:选择所有给出祖先选择器的子孙选择器. 例子: <!doctype html> <html lang='zh'> <head> <meta charset='utf-8'> <title>next adjacent demo</title> <script src="http://code.jquery.com/jquery-1.9.1.js"><…

jquery1.9学习笔记之层级选择器(二)

子孙选择器(“祖先子孙”) 描述:选择所有给出祖先选择器的子孙选择器. 例子: 用蓝色虚线边框标记所有表单子孙元素的输入.表单里的输入框用黄色背景. <!doctype html><html lang='zh'> <head> <meta charset='utf-8'> <title>descendant demo</title> <style type="text/css"> form{ bord…

jquery1.9学习笔记之层级选择器(一)

子选择器(“parent > child”) 描述:选择所有父元素的直系子元素. 例子: <!doctype html> <html lang='zh'> <head> <meta charset='utf-8'> <title>child demo</title> <style type="text/css"> body{ font-size: 14px; } </style> &l…

jquery1.9学习笔记之选择器(基本元素五)

多种元素选择器 jQuery("selector1,selector2,selectorN") 例子: <!doctype html> <html lang='zh'> <head> <meta charset='utf-8'> <title>multiple demo</title> <style type="text/css"> </style> <scrip…

jquery1.9学习笔记之选择器(基本元素四)

ID选择器("#id") 描述: 选择与给出ID属性匹配的单元标签. 对于ID选择器,jquery使用JS的函数document.getElementById(),当一个标签附加到ID选择器上时,也是非常有效的.如h2#pageTitle,jquery会在识别元素标签前进行检查以做出匹配. 例子: <!doctype html> <html> <head> <meta charset='utf-8'> <title>id de…

【JQUERY1.9学习笔记 之可见性过滤器(一) 隐藏选择器】的更多相关文章

【JQUERY1.9学习笔记之可见性过滤器(一) 隐藏选择器】的更多相关文章