-
属性选择器让你可以基于属性来定位一个元素。可以只指定该元素的某个属性，这样所有使用该属性而不管它的值，这个元素都将被定位，也可以更加明确并定位在这些属性上使用特定值的元素，这就是属性选择器展示它们的威力的地方。 描述如下： $("[att |= 'value']")选择指定属性值等于给定字符串value或以该字符串为前缀 $("[att *= 'value']")选择指定属性具有包含一个给定的字符串value的元素 $("[att -= 'value']")选择指定属性用空格作分隔且值中包含一个给定值value的元素 $("[att = 'value']")选择指定属性为给定的值value的元素 $("[att != 'value']")选择不存在的指定元素或指定元素的属性值不等于给定值得元素 $("[att ^= 'value']")选择指定属性是以给定字符串value开始的元素 $("[att $= 'value']")选择是定属性以给定字符串value结尾的元素，比较时区分大小写 $("[att]")选择所有具有指定att属性的元素 $("[attFilter1][attFilterN]")选择匹配所有指定的属性选择器的元素 浏览器支持： [att=val]、[att]、[att|=val]、[att~=val] 属于CSS 2.1规范 [ns|attr]、[att^=val]、[att*=val]、[att$=val] 属于CSS3规范 [name!="value"] 属于jQuery 扩展的选择器 CSS选择器无论CSS2.1版本还是CSS3版本，IE7和IE8都支持，webkit、Gecko核心及Opera也都支持，只有IE6以下浏览器才不支持 在这么多属性选择器中[attr="value"]和[attr*="value"]是最实用的 [attr="value"]能帮我们定位不同类型的元素，特别是表单form元素的操作，比如说input[type="text"],input[type="checkbox"]等 [attr*="value"]能在网站中帮助我们匹配不同类型的文件查看全部
-
HTML代码 <div>元素一</div> <div>元素二</div> <div>元素三</div> JavaScript代码 var $div = $('div') //jQuery对象 var div = $div[0] //转化成DOM对象 div.style.color = 'red' //操作dom对象的属性 var $div = $('div') //jQuery对象 var div = $div.get(0) //通过get方法，转化成DOM对象 div.style.color = 'red' //操作dom对象的属性查看全部
-
指定选择器/指定元素查看全部
-
元素包含文本节点查看全部
-
:checked 是表单对象属性筛选选择器，表示选取被选中的<input>元素查看全部
-
jQuery选择器之内容筛选选择器 选择器 描述 $(":contains(text)") 选择所有包含指定文本的元素 $(":parent") 选择所有含有子元素或者文本的元素 $(":empty") 选择所有没有子元素的元素(包含文本节点) $(":has(selector)") 选择元素中至少包含指定选择器的元素 注意事项： 1. :contains 与 :has 都有查找的意思，但是 contains 查找包含"指定文本"的元素，has 查找包含"指定元素的元素" 2. 如果 :contains 匹配的文本包含在元素的子元素中，同样认为是符合条件的。 3. :parent 与 :empty 是相反的，两者所涉及的子元素，包括文本节点查看全部
-
JS原生语法:window.onload = function(){} jQuery语法:$(document).ready(function() {}) 我们要获取页面上这个id为imooc的div元素，然后给这个文本节点增加一段文字：“您好！通过慕课网学习jQuery才是最佳的途径”，并且让文字颜色变成红色。 普通处理，通过标准JavaScript处理： var p = document.getElementById('imooc'); p.innerHTML = '您好！通过慕课网学习jQuery才是最佳的途径'; p.style.color = 'red'; jQuery的处理： var $p = $('#imooc'); $p.html('您好！通过慕课网学习jQuery才是最佳的途径').css('color','red'); 通过jQuery处理DOM的操作，可以让开发者更专注业务逻辑的开发，而不需要我们具体知道哪个DOM节点有那些方法，也不需要关心不同浏览器的兼容性问题，我们通过jQuery提供的API进行开发，代码也会更加精短。查看全部
-
jQuery选择器之可见性筛选选择器 元素有显示状态与隐藏状态，jQuery根据元素的状态扩展了可见性筛选选择器:visible与:hidden 描述如下： $(":visible") 选择所有显示的元素 $（":hidden"）选择所有隐藏的元素 这2个选择器都是 jQuery 延伸出来的，看起来比较简单，但是元素可见性依赖于适用的样式 :hidden选择器，不仅仅包含样式是display="none"的元素，还包括隐藏表单、visibility等等 我们有几种方式可以隐藏一个元素： CSS display的值是none。 type="hidden"的表单元素。 宽度和高度都显式设置为0。 一个祖先元素是隐藏的，该元素是不会在页面上显示 CSS visibility的值是hidden CSS opacity的指是0 如果元素中占据文档中一定的空间,元素被认为是可见的。 可见元素的宽度或高度，是大于零。 元素的visibility: hidden 或 opacity: 0被认为是可见的，因为他们仍然占用空间布局。 不在文档中的元素是被认为是不可见的，如果当他们被插入到文档中，jQuery没有办法知道他们是否是可见的，因为元素可见性依赖于适用的样式查看全部
-
当页面加载完成后，在页面中以居中的方式显示“您好！通过慕课网学习 jQuery 才是最佳的途径”字样。 <!DOCTYPE html> <html> <head> <meta charset="utf-8"/> <title>第一个简单的jQuery程序</title> <style type="text/css"> div{ padding:8px 0px; font-size:12px; text-align:center; border:1px solid #888; } </style> <script src="http://libs.baidu.com/jquery/1.9.1/jquery.min.js"></script> <script type="text/javascript"> $(document).ready(function() { $("div").html("您好！通过慕课网学习jQuery才是最佳的途径。"); }); </script> </head> <body> <div></div> </body> </html> 代码分析： $(document).ready 的作用是等页面的文档（document）中的节点都加载完毕后，再执行后续的代码，因为我们在执行代码的时候，可能会依赖页面的某一个元素，我们要确保这个元素真正的的被加载完毕后才能正确的使用。查看全部
-
内容筛选选择器 $(":contain(text)")选择所有包含指定文本的元素 $(":parent")选择所有包含子元素或者文本的元素 $(":empty")选择所有没有子元素的元素（包含文本节点） $(":has(selector)")选择元素中至少包含指定选择器的元素 注意事项： :contains与:has都有查找的意思，但是contains查找包含“指定文本”的元素，has查找包含“指定元素”的元素 如果:contains匹配的文本包含在元素的子元素中，同样认为是符合条件的。 :parent与:empty是相反的，两者所涉及的子元素，包括文本节点查看全部
-
jQuery是一个JavaScript脚本库，不需要特别的安装，只需要我们在页面 <head> 标签内中，通过 script 标签引入 jQuery 库即可。 <!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <script type="text/javascript" src="http://libs.baidu.com/jquery/1.9.1/jquery.js"></script> <title>环境搭建</title> </head> <body> <script type="text/javascript"> alert($) </script> </body> </html>查看全部
-
$(":first") 匹配第一个元素； $(":last") 匹配最后一个元素； $(":not(selector)") 过滤的选择器，选择所有的元素去除比匹配给定的选择器； $(":eq(index)");匹配的集合中选择索引为index的元素； $(":gt(index)");选择匹配集合中大于给定的索引值index的元素； $(":even");选择索引值为偶数的元素； $(":odd");选择索引值为奇数的元素 $(":lt(index)");选择匹配集合中所有索引值小于index参数的元素； $(":header");选择指定的元素的所有标题元素，如h1 h2等； $(":animated");选择正在执行动画效果的元素 $(":root");选择该文档的根元素； $("lang(language)");选择指定的语言的所有元素； 注意事项： :eq(), :lt(), :gt(), :even, :odd 用来筛选他们前面的匹配表达式的集合元素，根据之前匹配的元素在进一步筛选，注意jQuery合集都是从0开始索引 gt是一个段落筛选，从指定索引的下一个开始，gt(1) 实际从2开始查看全部
-
jQuery选择器之基本筛选选择器 选择器 描述 $(":first") 匹配第一个元素 $(":last") 匹配最后一个元素 $(":not(selector)") 一个用来过滤的选择器，选择所有元素去除不匹配给定的选择器元素 $(":eq(index)") 在匹配的集合中选择索引值为index的元素 $(":gt(index)") 选择匹配集合中所有大于给定index(索引值)的元素 $(":even") 选择索引值为偶数的元素，从0开始计数 $(":odd") 选择索引值为奇数的元素，从0开始计数 $(":lt(index)") 选择匹配集合中所有索引值小于给定index参数的元素 $(":header") 选择所有标题元素，像h1,h2,h3等 $(":lang(language)") 选择指定语言的所有元素 $(":root") 选择该文档的根元素 $(":animated") 选择所有正在执行动画效果的元素 注意事项： 1. :eq() , :lt() , :even , :odd 用来筛选他们前面的匹配表达式的集合元素，根据之前匹配的元素在进一步筛选，注意jQuery集合都是从0开始索引。 2.gt 是一个段落筛选，从指定索引的下一个开始，gt(1)实际是从2开始查看全部
-
父母 子选择器 祖先 后代选择器 之前的之后的 相邻兄弟选择器 之前的 兄弟 一般兄弟选择器查看全部
-
兼容性的问题 1. IE会将注释节点实现为元素，所以在IE中调用getElementsByTagName里面会包含注释节点，这个通常是不应该的。 2. getElementById的参数在IE8及较低的版本不区分大小写。 3. IE7及较低的版本中，表单元素中，如果表单A的name属性名用了另一个元素B的ID名并且A在B之前，那么getElementById会选中A。 4. IE8及较低的版本，浏览器不支持getElementsByClassName查看全部
举报
0/150
提交
取消