-
<script type="text/javascript"> //查找所有div中，属性name=p1的div元素 $('div[name=p1]').css("border", "3px groove red"); </script> name="p1"查看全部
-
<script type="text/javascript"> //查找所有div中，有属性name中的值包含一个连字符“空”和“a”的div元素 $('div[name~="a"]').css("border", "3px groove #668B8B"); </script> name="a b"查看全部
-
<script type="text/javascript"> //查找所有div中，有属性name中的值包含一个test字符串的div元素 $('div[name*="test"]').css("border", "3px groove #00FF00"); </script>查看全部
-
$( "parent > child" ) 子选择器：选择所有指定“parent”元素中指定的"child"的直接子元素。 $("ancestor descendant") 后代选择器：选择给定的祖先元素的所有后代元素, 一个元素的后代可能是该元素的一个孩子，孙子，曾孙等 $("prev + next") 相邻兄弟选择器：选择所有紧接在“prev”元素后的“next”元素 $("prev ~ siblings") 一般兄弟选择器：匹配“prev”元素之后的所有 兄弟元素。具有相同的父元素，并匹配过滤“siblings”选择器查看全部
-
:hidden选择器，不仅仅包含样式是display="none"的元素，还包括隐藏表单、visibility等等 我们有几种方式可以隐藏一个元素： CSS display的值是none。 type="hidden"的表单元素。 宽度和高度都显式设置为0。 一个祖先元素是隐藏的，该元素是不会在页面上显示 CSS visibility的值是hidden CSS opacity的指是0 如果元素中占据文档中一定的空间,元素被认为是可见的。 可见元素的宽度或高度，是大于零。 元素的visibility: hidden 或 opacity: 0被认为是可见的，因为他们仍然占用空间布局。查看全部
-
jQuery选择器之子元素筛选选择器 选择器 描述 $(":first-child") 选择所有父级元素下的第一子元素 $(":last-child") 选择所有父级元素下的最后一个子元素 $(":only-child") 如果某个元素是其父元素的唯一元素，那么它就会被选中 $(":nth:child") 选择的他们所有父元素的第n个子元素 $(":nth-last-child") 选择所有他们父元素的第n个子元素，计数从最后一个元素开始到第一个 注意事项 1. :first 只匹配一个单独的元素，但是 :first-child 选择器可以匹配多个:即为每个父级元素匹配第一个子元素。这相当于 :nth-child(1) 2. :last 只匹配一个单独的元素，:last-child 选择器可以匹配多个元素:即，为每一父级元素匹配最后一个子元素 3. 如果子元素只有一个的话，:first-child 与 :last-child 是同一个 4. :only-child 匹配某个元素是父元素中唯一的子元素，就是说当前子元素是父元素中唯一的元素，则匹配 5. jQuery实现 :nth-child(n)是严格来自CSS规范，所以n值是"索引"，也就是说，从1开始计数，:nth-child(index)从1开始的，而eq(index)是从0开始的。 6. nth-child(n) 与 :nth-last-child(n) 的区别前者是从前往后计算，后者从后往前计算查看全部
-
读取、修改元素的html结构或者元素的文本内容是常见的DOM操作，jQuery针对这样的处理 提供了2个便捷的方法html（）与.text（） .html()方法 获取集合中第一个匹配元素的HTML内容或设置每一个匹配元素的html内容，具体有3种用法： 1.html（）不传入值，就是获取集合中第一个匹配元素的HTML内容 2.html（htmlstring）设置每一个匹配元素的html内容 3.html（function（index，oldhtml））用来返回设置HTML内容的一个函数 注意事项： .HTML()方法内使用 的是dom的innerhtml属性来处理的，所以在设置与获取上需要注意的一个最重要的问题，这个操作是针对整个HTML内容（不仅仅只是文本内容） .text()方法 得到匹配元素集合中每个元素的文本内容结合，包括它们的后代，或者设置匹配元素集合中每个元素的文本内容为指定的文本内容。 具体有3种用法： 1.text（）得到匹配元素集合中每个元素的合并文本，包括它们的后代 2.text（textString）用于设置匹配内容的文本 3.text（function（index，text））用来返回设置文本内容的一个函数 .text（）结果返回一个字符串，包括所有匹配元素的合并文本 .html与.text的异同： 1.html与.text的方法操作是一样，只是在具体针对处理对象不同 2.html处理的是元素内容，.text处理的是文本内容 3.html只能使用在HTML文档中，.text在XML和HTML文档中都能使用 4.如果处理的对象只有一个文本节点，那么html处理的结果与text是一样的 5.火狐不支持innerText属性，，用了类似的textContent属性，.text()方法综合了2个属性的支持，所以可以兼容所有浏览器查看全部
-
我觉得老师应该说一下： 如果传入的参数是id则在id前加上前缀"#"，用于告诉jQuery我传入的是id； 如果传入的参数是class则在class前加上前缀".",用于告诉jQuery我传入的是class； 如果传入的参数是标签名则无需任何前缀，用于告诉jQuery我传入的是标签名；查看全部
-
通过$("")方法会得到一个$p的JQuery对象，这是一个数组对象。查看全部
-
jQuery的处理： var $p = $('#imooc'); $p.html('您好！通过慕课网学习jQuery才是最佳的途径').css('color','red'); 通过$('#imooc')方法会得到一个$p的jQuery对象，$p是一个类数组对象。这个对象里面包含了DOM对象的信息，然后封装了很多操作方法，调用自己的方法html与css，得到的效果与标准的JavaScript处理结果是一致的。查看全部
-
操作特性的DOM方法主要有3个，getattribute方法，setattribute方法和removeattribute方法，就算如此的实际操作中还是会存在很多问题，这里先不说，而在jQuery中用一个attr() 与removeattr（）就可以全部搞定了，包括兼容问题 jquiery中用attr()方法来获取和设置元素属性，attr是attribute（属性）的缩写，在jQuery Dom操作中会经常用到attr（） attr（）有四个表达式 1.attr（传入属性名）：获取属性的值 2.attr（属性名，属性值）：设置属性的值； 3.attr（属性名，函数值）：设置属性的函数值； 4.attr(attribute)：给指定元素设置多个属性值； 即：（属性名一：“属性值一”，属性名二：“属性之二”，。。。。） removeattr（删除方法） .removeAttr（attributeName）：为匹配的元素集合中的每个元素中移除一个属性（attribute） 优点： attr，removeAttr都是jQuery为了属性操作封装的，直接在jQuery对象上调用该方法，很容易对属性进行操作，也不需要去特意的理解浏览器的属性名不同的问题 注意的问题； dom中有个概念的区分：Attrbute和Property翻译出来都是“属性”《js高级程序设计》书中翻译为“特性”和“属性”。简单理解，Atrribute就是dom节点自带的属性 例如：HTML中常用的id，class，title，align等： <idv id="imooc" title="慕课网"></div> 而property是这个dom元素作为对象，其附加的内容，例如。tagName，nodeName,ondeType,,defaultcheked，和defaultselected使用，pro（）方法进行取值或赋值等 获取attribute就需要用attr，获取property就需要用prop查看全部
-
jQuery选择器之属性筛选选择器 选择器 描述 $("[attribute|='value"]) 选择指定属性值等于给定字符串或以该文字串为前缀(该字符串后跟一个连字符"-")的元素 $("[attribute*='value']") 选择指定属性具有包含一个给定的字符串的元素(选择给定的属性是以包含某些值的元素) $("[attribute~='value']") 选择指定属性用空格分隔的值中包含一个给定值的元素 $("[attribute='value']") 选择指定属性是给定值的元素 $("[attribute!='value']") 选择不存在指定属性，或者指定的属性值不等于给定值的元素 $("[attribute^='value']") 选择指定属性是以给定字符串开始的元素 $("[attribute$='value']") 选择指定属性是以给定值结尾的元素，这个比较是区分大小写的 $("[attribute]") 选择所有具有指定属性的元素，该属性可以任意值 $("[attributeFilter1][attributeFilterN]") 选择匹配所有指定的属性筛选器的元素查看全部
-
jQuery选择器之子元素筛选选择器 $(":first-child")选择所有父级元素下的第一个子元素 $(":last-child")选择所有父级元素的最后一个子元素 $(":only-child")如果某个元素是其父元素的唯一子元素，那么它就会被选中 $(":nth-child")选择的他们所有父元素的第n个子元素 $(":nth-lat-child")选择所有他们父元素的第n个子元素，计数从最后一个元素开始到第一个 注意事项： :first只匹配一个单独的元素，但是:first-child选择器可以匹配多个：即为每个父级元素匹配第一个子元素。这相当于:nth-child(1) :last 只匹配一个单独的元素， :last-child 选择器可以匹配多个元素：即，为每个父级元素匹配最后一个子元素 如果子元素只有一个的话，:first-child与:last-child是同一个 :only-child匹配某个元素是父元素中唯一的子元素，就是说当前子元素是父元素中唯一的元素，则匹配 jQuery实现:nth-child(n)是严格来自CSS规范，所以n值是“索引”，也就是说，从1开始计数，:nth-child(index)从1开始的，而eq(index)是从0开始的 nth-child(n) 与 :nth-last-child(n) 的区别前者是从前往后计算，后者从后往前计算查看全部
-
类选择器 $( ".class" ) 类选择器相对id选择器来说效率相对会低一点但是优势就是可以多选 jQuery除了选择上的简单而且没有再次使用循环处理。原生JS需要循环处理 <script type="text/javascript"> //通过原生方法处理 //样式是可以多选的所以得到的是一个合集 //需要通过循环给合集中每一个元素修改样式 var divs = document.getElementsByClassName('aaron'); for (var i = 0; i < divs.length; i++) { divs[i].style.border = "3px solid blue"; } </script> <script type="text/javascript"> //通过jQuery直接传入class //class选择器可以选择多个元素 $("imooc").css("border", "3px solid red"); </script>查看全部
-
如果多个元素分配了相同的id，那么只匹配dom集合中的第一个id script写在末尾的body处时，可以当页面加载后再加载，一些元素如获取DOM的对象，写在head时，则不会加载。如果写在head，则要加方法$(document).ready(function() {})，注意html解析的顺序查看全部
举报
0/150
提交
取消