-
通过动态改变类名(class),可以让其修改元素呈现出不同的效果。在HTML结构中里,多个class以空格分隔,当一个节点(或称为一个标签)含有多个class时,DOM元素响应的className属性获取的不是class名称的数组,而是一个含有空格的字符串,这就使得多class操作变得很麻烦。同样的jQuery开发者也考虑到这种情况,增加了一个.addClass()方法,用于动态增加class类名 .addClass( className )方法 .addClass( className ) : 为每个匹配元素所要增加的一个或多个样式名 .addClass( function(index, currentClass) ) : 这个函数返回一个或更多用空格隔开的要增加的样式名 注意事项: .addClass()方法不会替换一个样式类名。它只是简单的添加一个样式类名到元素上查看全部
-
Query选择器之层级选择器 选择器中的层级选择器就是用来处理这种关系 子元素 后代元素 兄弟元素 相邻元素 通过一个列表,对比层级选择器的区别: 如:$('div > p') 子选择器 $('div p ’)后代选择器 $(".prev + div ") 相邻兄弟选择器 $(".prev ~ div")一般兄弟选择器查看全部
-
jQuery中有一个.val()方法主要是用于处理表单元素的值,比如 input, select 和 textarea。 .val()方法 .val()无参数,获取匹配的元素集合中第一个元素的当前值 .val( value ),设置匹配的元素集合中每个元素的值 .val( function ) ,一个用来返回设置值的函数 注意事项: 通过.val()处理select元素, 当没有选择项被选中,它返回null .val()方法多用来设置表单的字段的值 如果select元素有multiple(多选)属性,并且至少一个选择项被选中, .val()方法返回一个数组,这个数组包含每个选中选择项的值 .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()都可以使用回调函数的返回值来动态的改变多个元素的内容。查看全部
-
attr()有4个表达式 attr(传入属性名):获取属性的值 attr(属性名, 属性值):设置属性的值 attr(属性名,函数值):设置属性的函数值 attr(attributes):给指定元素设置多个属性值,即:{属性名一: “属性值一” , 属性名二: “属性值二” , … … } removeAttr()删除方法 .removeAttr( attributeName ) : 为匹配的元素集合中的每个元素中移除一个属性(attribute)查看全部
-
jQuery选择器之全选择器(*选择器) 在CSS中,经常会在第一行写下这样一段样式 * {padding: 0; margin: 0;} 通配符*意味着给所有的元素设置默认的边距。jQuery中我们也可以通过传递*选择器来选中文档页面中的元素 描述:$("*")查看全部
-
元素选择器:根据给定(html)标记名称选择所有的元素 描述:$("element") 如: $("p").css("border","3px solid red")查看全部
-
.html()方法 获取集合中第一个匹配元素的HTML内容 或 设置每一个匹配元素的html内容,具体有3种用法: .html() 不传入值,就是获取集合中第一个匹配元素的HTML内容 .html( htmlString ) 设置每一个匹配元素的html内容 .html( function(index, oldhtml) ) 用来返回设置HTML内容的一个函数 注意事项: .htm()方法内部使用的是DOM的innerHTML属性来处理的,所以在设置与获取上需要注意的一个最重要的问题,这个操作是针对整个HTML内容(不仅仅只是文本内容) .text()方法 得到匹配元素集合中每个元素的文本内容结合,包括他们的后代,或设置匹配元素集合中每个元素的文本内容为指定的文本内容。,具体有3种用法: .text() 得到匹配元素集合中每个元素的合并文本,包括他们的后代 .text( textString ) 用于设置匹配元素内容的文本 .text( function(index, text) ) 用来返回设置文本内容的一个函数 注意事项: .text()结果返回一个字符串,包含所有匹配元素的合并文本 .html与.text的异同: .html与.text的方法操作是一样,只是在具体针对处理对象不同 .html处理的是元素内容,.text处理的是文本内容 .html只能使用在HTML文档中,.text 在XML 和 HTML 文档中都能使用 如果处理的对象只有一个子文本节点,那么html处理的结果与text是一样的 火狐不支持innerText属性,用了类似的textContent属性,.text()方法综合了2个属性的支持,所以可以兼容所有浏览器查看全部
-
jquery除了选择上的简单,而且也没有再次使用循环处理查看全部
-
jQuery选择器之类选择器 类选择器,顾名思义,通过class样式类名来获取节点 描述:$(".class") 如: $(".imooc").css("border","3px solid red");查看全部
-
jQuery选择器之id选择器 id选择器:一个用来查找的ID,即元素的id属性 $("#id") 如: $("#imooc").css("border","3px solid red");查看全部
-
显示通过html方法获取到的内容 <div class="div"> <a>:first-child</a> <a>第二个元素</a> <a>:last-child</a> </div> <div class="div"> <a>:first-child</a> <a>第二个元素</a> <a>:last-child</a> </div> 显示通过text方法获取到的内容 :first-child 第二个元素 :last-child :first-child 第二个元素 :last-child查看全部
-
相比较jQuery转化成DOM,开发中更多的情况是把一个dom对象加工成jQuery对象。$(参数)是一个多功能的方法,通过传递不同的参数而产生不同的作用。 如果传递给$(DOM)函数的参数是一个DOM对象,jQuery方法会把这个DOM对象给包装成一个新的jQuery对象 通过$(dom)方法将普通的dom对象加工成jQuery对象之后,我们就可以调用jQuery的方法了 如: HTML代码 <div>元素一</div> <div>元素二</div> <div>元素三</div> JavaScript代码 var div= document.getElementsByTagName('div'); var $div = $(div); var $first = $div.first(); $first.css('color','red');查看全部
-
jQuery中用attr()方法来获取和设置元素属性,attr是attribute(属性)的缩写,在jQuery DOM操作中会经常用到attr() attr()有4个表达式 attr(传入属性名):获取属性的值 attr(属性名, 属性值):设置属性的值 attr(属性名,函数值):设置属性的函数值 attr(attributes):给指定元素设置多个属性值,即:{属性名一: “属性值一” , 属性名二: “属性值二” , … … } removeAttr()删除方法 .removeAttr( attributeName ) : 为匹配的元素集合中的每个元素中移除一个属性(attribute) 注意的问题: dom中有个概念的区分:Attribute和Property翻译出来都是“属性”,《js高级程序设计》书中翻译为“特性”和“属性”。简单理解,Attribute就是dom节点自带的属性 例如:html中常用的id、class、title、align等: <div id="immooc" title="慕课网"></div> 而Property是这个DOM元素作为对象,其附加的内容,例如,tagName, nodeName, nodeType,, defaultChecked, 和 defaultSelected 使用.prop()方法进行取值或赋值等 获取Attribute就需要用attr,获取Property就需要用prop查看全部
-
如何把jQuery对象转成DOM对象? 利用数组下标的方式读取到jQuery中的DOM对象 HTML代码 <div>元素一</div> <div>元素二</div> <div>元素三</div> JavaScript代码 var $div = $('div') var div = $div[0] div.style.color = 'red' 通过jQuery自带的get()方法: var $div = $('div') var div = $div.get(0) div.style.color = 'red'查看全部
-
查找所有input所有可用的(未被禁用的元素)input元素。 $('input:enabled') 查找所有input所有不可用的(被禁用的元素)input元素。 $('input:disabled') 查找所有input所有勾选的元素(单选框,复选框) 移除input的checked属性 $('input:checked') 查找所有option元素中,有selected属性被选中的选项 移除option的selected属性 $('option:selected')查看全部
举报
0/150
提交
取消