慕课网

jQuery基础(二)—DOM篇

最热最新

一个人一首歌0

创建元素：document.createElement（每一个元素节点都要单独创建）设置属性：setAttribute 添加文本：innnerHTML 加入到文档流中：appendChild

查看全部

0 采集收起来源：DOM创建节点及节点属性
2016-10-24
忘忧_草

.prepend()和.prependTo()实现同样的功能，主要的不同是语法，插入的内容和目标的位置不同都是插入成为匹配元素子元素中，成为匹配元素的第一个子元素。 append()向每个匹配的元素内部追加内容 prepend()向每个匹配的元素内部前置内容 appendTo()把所有匹配的元素追加到另一个指定元素的集合中 prependTo()把所有匹配的元素前置到另一个指定的元素集合中

查看全部

0 采集收起来源：DOM内部插入prepend()与prependTo()
2016-10-24
忘忧_草

A.after(B): 将B添加到A的后面（兄弟节点）A可能是多个元素的时候在每一个A后面都添加一次。 A.before(B): 将B添加到A的前面（兄弟节点）A 可能是多个匹配元素的时候在每个A前面都添加一次。

查看全部

0 采集收起来源：DOM外部插入after()与before()
2016-10-24
忘忧_草

A.append(B) : 将B 添加到A的 A.appendTo(B) : 将A 添加到B的

查看全部

1 采集收起来源：DOM内部插入append()与appendTo()
2016-10-24
忘忧_草

创建了一个元素之后要记得使用.append()等方法将其添加到html文档中，否者就是徒劳无功了

查看全部

0 采集收起来源：jQuery节点创建与属性的处理
2016-10-24
weibo_本宫li不矫情

jQuery遍历之add()方法:.add()的参数可以几乎接受任何的$()，包括一个jQuery选择器表达式，DOM元素，或HTML片段引用简单的看一个案例：操作：选择所有的li元素，之后把p元素也加入到li的合集中 <ul> <li>list item 1</li> <li>list item 3</li> </ul> <p>新的p元素</p> 处理一：传递选择器 $('li').add('p') 处理二：传递dom元素 $('li').add(document.getElementsByTagName('p')[0]) 还有一种方式，就是动态创建P标签加入到合集，然后插入到指定的位置，但是这样就改变元素的本身的排列了 $('li').add('<p>新的p元素</p>').appendTo(目标位置)

查看全部

0 采集收起来源：jQuery遍历之add()方法
2018-03-22
weibo_本宫li不矫情

jQuery遍历之prev()方法快速查找指定元素集合中每一个元素紧邻的前面同辈元素的元素集合 <script type="text/javascript"> $("button:first").click(function() { //通过prev方法，找到每个class=item-2的li节点所对应的上一个兄弟节点 $('.item-2').prev().css('border', '1px solid red') //? }) </script> <script type="text/javascript"> $("button:last").click(function() { //找到所有class=item-2的li //然后筛选出最后一个，加上蓝色的边 $('.item-3').prev(':last').css('border', '1px solid blue') })

查看全部

0 采集收起来源：jQuery遍历之prev()方法
2018-03-22
weibo_本宫li不矫情

jQuery遍历之next()方法,快速查找指定元素集合中每一个元素紧邻的后面同辈元素的元素集合 next()无参数://找到所有class=item-2的li 然后给每个li加上红色的边 $('.item-2').next().css('border','1px solid red') next()方法选择性地接受同一类型选择器表达式 //找到所有class=item-3的li //然后筛选出第一个li，加上蓝色的边 $('.item-2').next(':first').css('border', '1px solid blue')

查看全部

0 采集收起来源：jQuery遍历之next()方法
2016-10-23
weibo_本宫li不矫情

不是很理解，，，， jQuery遍历之closest()方法 closest()方法接受一个匹配元素的选择器字符串从元素本身开始，在DOM 树上逐级向上级元素匹配，并返回最先匹配的祖先元素注意事项：在使用的时候需要特别注意下粗看.parents()和.closest()是有点相似的，都是往上遍历祖辈元素，但是两者还是有区别的，否则就没有存在的意义了起始位置不同：.closest开始于当前元素 .parents开始于父元素遍历的目标不同：.closest要找到指定的目标，.parents遍历到文档根元素，closest向上查找，直到找到一个匹配的就停止查找，parents一直查找到根元素，并将匹配的元素加入集合结果不同：.closest返回的是包含零个或一个元素的jquery对象，parents返回的是包含零个或一个或多个元素的jquery对象

查看全部

0 采集收起来源：jQuery遍历之closest()方法
2016-10-23
weibo_本宫li不矫情

jQuery遍历之parents()方法快速查找合集里面的每一个元素的所有祖辈元素同样也有 parents()无参数 parents()方法选择性地接受同一型选择器表达式注意事项： 1 .parents()和.parent()方法是相似的，但后者只是进行了一个单级的DOM树查找 2 $( "html" ).parent()方法返回一个包含document的集合，而$( "html" ).parents()返回一个空集合。

查看全部

0 采集收起来源：jQuery遍历之parents()方法
2018-03-22
weibo_本宫li不矫情

jQuery遍历之find()方法可以快速查找DOM树中的这些元素的后代元素，find（）是后代关系，包含父子关系注意： find是遍历当前元素集合中每个元素的后代。与其他的树遍历方法不同，选择器表达式对于 .find() 是必需的参数。如果我们需要实现对所有后代元素的取回，可以传递通配选择器 '*'。 find只在后代中遍历，不包括自己

查看全部

0 采集收起来源：jQuery遍历之find()方法
2016-10-23
weibo_本宫li不矫情

jQuery遍历之children()方法，注意是父亲-儿子的关系，子孙辈的不考虑 children()无参数，$('.div').children().css('border','3px solid red') .children()方法选择性地接受同一类型选择器表达式 $("div").children(".selected") //找到所有class=div的元素 //找到其对应的子元素ul，然后筛选出最后一个，给边宽加上颜色 $('.div').children(':last').css('border', '3px s

查看全部

0 采集收起来源：jQuery遍历之children()方法
2018-03-22
weibo_本宫li不矫情

DOM包裹wrapInner()方法给集合中元素的内部子元素包裹，增加包裹的HTML结构，方法和前面的一样同样两种方法： .wraplnner（） <p>p元素</p> <p>p元素</p> 给所有p元素增加一个div包裹 $('p').wrapInner('<div></div>') 最后的结构，匹配的p元素的内部元素被div给包裹了 <p> <div>p元素</div> </p> <p> <div>p元素</div> </p> .wraplnner(function):允许我们用一个callback函数做参数，每次遇到匹配元素时，该函数被执行，返回一个DOM元素，jQuery对象，或者HTML片段，用来包住匹配元素的内容如上面例子$('p').wrapInner(function() { return '<div><div/>'; })结果和上面一样

查看全部

0 采集收起来源：DOM包裹wrapInner()方法
2018-03-22
weibo_本宫li不矫情

DOM包裹wrapAll()方法，处理方法跟wrap一样，只是wrapAll是作用在一个集合，也就是多个元素，而wrap是单个元素

查看全部

0 采集收起来源：DOM包裹wrapAll()方法
2016-10-23
weibo_本宫li不矫情

DOM包裹unwrap()方法:个unwarp()方法，作用与wrap方法是相反的。将匹配元素集合的父级元素删除，保留自身（和兄弟元素，如果存在）在原来的位置。 <div> <p>p元素</p> </div> $('p').unwarp();//这样只会删除父辈div元素了 remove或者empty方法会删除完，但是要保留P元素就会很麻烦的步骤

查看全部

0 采集收起来源：DOM包裹unwrap()方法
2018-03-22

首页上一页 279 280 281 282 283 284 285 下一页尾页

0/150

提交

取消

开始学习

课程须知: 1、有HTML/CSS基础 2、有JavaScript基础

老师告诉你能学到什么？: 1、jQuery的语法 2、jQuery节点操作