-
.html(),.text()和.val()的差异总结: .html(),.text(),.val()三种方法都是用来读取选定元素的内容;只不过.html()是用来读取元素的html内容(包括html标签),.text()用来读取元素的纯文本内容,包括其后代元素,.val()是用来读取表单元素的"value"值。其中.html()和.text()方法不能使用在表单元素上,而.val()只能使用在表单元素上;另外.html()方法使用在多个元素上时,只读取第一个元素;.val()方法和.html()相同,如果其应用在多个元素上时,只能读取第一个表单元素的"value"值,但是.text()和他们不一样,如果.text()应用在多个元素上时,将会读取所有选中元素的文本内容。 .html(htmlString),.text(textString)和.val(value)三种方法都是用来替换选中元素的内容,如果三个方法同时运用在多个元素上时,那么将会替换所有选中元素的内容。 .html(),.text(),.val()都可以使用回调函数的返回值来动态的改变多个元素的内容。查看全部
-
jquer查看全部
-
this是JavaScript中的关键字,指的是当前的上下文对象,简单的说就是方法/属性的所有者 下面例子中,imooc是一个对象,拥有name属性与getName方法,在getName中this指向了所属的对象imooc var imooc = { name:"慕课网", getName:function(){ //this,就是imooc对象 return this.name; } } imooc.getName(); //慕课网 当然在JavaScript中this是动态的,也就是说这个上下文对象都是可以被动态改变的(可以通过call,apply等方法),具体的大家可以查阅相关资料 同样的在DOM中this就是指向了这个html元素对象,因为this就是DOM元素本身的一个引用 假如给页面一个P元素绑定一个事件: p.addEventListener('click',function(){ //this === p //以下两者的修改都是等价的 this.style.color = "red"; p.style.color = "red"; },false); 通过addEventListener绑定的事件回调中,this指向的是当前的dom对象,所以再次修改这样对象的样式,只需要通过this获取到引用即可 this.style.color = "red" 但是这样的操作其实还是很不方便的,这里面就要涉及一大堆的样式兼容,如果通过jQuery处理就会简单多了,我们只需要把this加工成jQuery对象 换成jQuery的做法: $('p').click(function(){ //把p元素转化成jQuery的对象 var $this= $(this) $this.css('color','red') }) 通过把$()方法传入当前的元素对象的引用this,把这个this加工成jQuery对象,我们就可以用jQuery提供的快捷方法直接处理样式了 总体: this,表示当前的上下文对象是一个html对象,可以调用html对象所拥有的属性和方法。 $(this),代表的上下文对象是一个jquery的上下文对象,可以调用jQuery的方法和属性值。查看全部
-
jQuery选择器之表单对象属性筛选选择器 $(":enabled")选取可用的表单元素 $(":disabled")选取不可用的表单元素 $(":checked")选取被选中的<input>元素 $(":selected")选取被选中的<option>元素 注意事项: 1、选择器适用于复选框和单选框,对于下拉框元素,使用:selected选择器 2、在某些浏览器中,选择器:checked可能会错误选取到<option>元素,所以保险起见选用选择器input:checked,确保只会选取<input>元素查看全部
-
jQuery选择器之表单元素选择器 $(":input")选择所有input、textarea、select和button元素 $(":text")匹配所有文本框 $(":password")匹配所有密码框 $(":radio")匹配所有单选按钮 $(":checkbox")匹配所有复选按钮 $(":image")匹配所有图像域 $(":submit")匹配所有提交按钮 $(":reset")匹配所有重置按钮 $(":button")匹配所有按钮 $(":file")匹配所有文件域 注意事项: 除了input筛选选择器,几乎每个表单类别筛选器都对应一个input元素的type值。大部分表单类别筛选器可以使用属性筛选器替换。比如 $(':password') == $('[type=password]')查看全部
-
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) 的区别前者是从前往后计算,后者从后往前计算查看全部
-
$("[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"]能在网站中帮助我们匹配不同类型的文件查看全部
-
hidden选择器,不仅仅包含样式是display="none"的元素,还包括隐藏表单、visibility等等 我们有几种方式可以隐藏一个元素: CSS display的值是none。 type="hidden"的表单元素。 宽度和高度都显式设置为0。 一个祖先元素是隐藏的,该元素是不会在页面上显示 CSS visibility的值是hidden CSS opacity的指是0 如果元素中占据文档中一定的空间,元素被认为是可见的。 可见元素的宽度或高度,是大于零。 元素的visibility: hidden 或 opacity: 0被认为是可见的,因为他们仍然占用空间布局。 不在文档中的元素是被认为是不可见的,如果当他们被插入到文档中,jQuery没有办法知道他们是否是可见的,因为元素可见性依赖于适用的样式查看全部
-
:contains与:has都有查找的意思,但是contains查找包含“指定文本”的元素,has查找包含“指定元素”的元素 如果:contains匹配的文本包含在元素的子元素中,同样认为是符合条件的。 :parent与:empty是相反的,两者所涉及的子元素,包括文本节点查看全部
-
注意事项: :eq(), :lt(), :gt(), :even, :odd 用来筛选他们前面的匹配表达式的集合元素,根据之前匹配的元素在进一步筛选,注意jQuery合集都是从0开始索引 gt是一个段落筛选,从指定索引的下一个开始,gt(1) 实际从2开始查看全部
-
$( "parent > child" ) 子选择器:选择所有指定“parent”元素中指定的"child"的直接子元素。 $("ancestor descendant") 后代选择器:选择给定的祖先元素的所有后代元素, 一个元素的后代可能是该元素的一个孩子,孙子,曾孙等 $("prev + next") 相邻兄弟选择器:选择所有紧接在“prev”元素后的“next”元素 $("prev ~ siblings") 一般兄弟选择器:匹配“prev”元素之后的所有 兄弟元素。具有相同的父元素,并匹配过滤“siblings”选择器 $( "parent > child" ) 子选择器:选择所有指定“parent”元素中指定的"child"的直接子元素。 $("ancestor descendant") 后代选择器:选择给定的祖先元素的所有后代元素, 一个元素的后代可能是该元素的一个孩子,孙子,曾孙等 $("prev + next") 相邻兄弟选择器:选择所有紧接在“prev”元素后的“next”元素 $("prev ~ siblings") 一般兄弟选择器:匹配“prev”元素之后的所有 兄弟元素。具有相同的父元素,并匹配过滤“siblings”选择器查看全部
-
$( "parent > child" ) 子选择器:选择所有指定“parent”元素中指定的"child"的直接子元素。 $("ancestor descendant") 后代选择器:选择给定的祖先元素的所有后代元素, 一个元素的后代可能是该元素的一个孩子,孙子,曾孙等 $("prev + next") 相邻兄弟选择器:选择所有紧接在“prev”元素后的“next”元素 $("prev ~ siblings") 一般兄弟选择器:匹配“prev”元素之后的所有 兄弟元素。具有相同的父元素,并匹配过滤“siblings”选择器查看全部
-
选择给定样式类名的所有元素,Class可以同时支持多个元素 标记名称选择所有的元素,元素节点是可以重复多个的 查找文档中的每一个元素查看全部
-
id是唯一的,每个id值在一个页面中只能使用一次。如果多个元素分配了相同的id,将只匹配该id选择集合的第一个DOM元素查看全部
举报
0/150
提交
取消