慕课网

jQuery基础(二)—DOM篇

最热最新

淡水狗

DOM包裹wrapInner()方法 .wrapInner( wrappingElement )：给集合中匹配的元素的内部，增加包裹的HTML结构讲指定元素的内部所有子元素用其他元素包裹起来，这个其他元素当作指定元素的子元素。例如：给所有元素增加一个p包裹 $('div').wrapInner('<p></p>') 最后的结构，匹配的di元素的内部元素被p给包裹了 <div> <p>p元素</p> </div> <div> <p>p元素</p> </div> .wrapInner( function ) ：允许我们用一个callback函数做参数，每次遇到匹配元素时，该函数被执行，返回一个DOM元素，jQuery对象，或者HTML片段，用来包住匹配元素的内容以上面案例为例， $('div').wrapInner(function() { return '<p></p>'; //回调，返回父元素p })

查看全部

0 采集收起来源：DOM包裹wrapInner()方法
2018-03-22
淡水狗

DOM包裹wrapAll()方法 wrap是针对单个dom元素处理，而wrapAll方法是把所有匹配元素外面增加一个大包裹（html结构） .wrapAll( wrappingElement )：给集合中匹配的元素增加一个外面包裹HTML结构简单的看一段代码： <p>p元素</p> <p>p元素</p> 给所有p元素增加一个div包裹 $('p').wrapAll('<div></div>') 最后的结构，2个P元素都增加了一个父div的结构 <div> <p>p元素</p> <p>p元素</p> </div> .wrapAll( function ) ：一个回调函数，返回用于包裹匹配元素的 HTML 内容或 jQuery 对象通过回调的方式可以单独处理每一个元素以上面案例为例， $('p').wrapAll(function() { return '<div><div></div>'; //通过回调的方式可以单独处理每一个元素 }) 以上的写法的结果如下，等同于warp的处理了 <div> <p>p元素</p> </div> <div> <p>p元素</p> </div>

查看全部

0 采集收起来源：DOM包裹wrapAll()方法
2018-03-22
淡水狗

DOM包裹unwrap()方法删除选中元素的父元素，与wrap()相反。将匹配元素集合的父级元素删除，保留自身（和兄弟元素，如果存在）在原来的位置。比remove()和empty()好的就是删除这段代码时，可以保留内部元素。语法：$('p').unwarp(); <script type="text/javascript"> $(".aaron2").on('click', function() { //找到所有p元素，删除父容器div $('a').unwrap(function(){ return '<div></div>'//回调，返回。意思就是返回父级div元素。 })

查看全部

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

DOM包裹wrap()方法 .wrap( wrappingElement )：在集合中匹配的每个元素周围包裹一个HTML结构，也就是给它增加一个父元素。给p元素增加一个div包裹 $('p').wrap('<div></div>') 最后的结构，p元素增加了一个父div的结构 <div> <p>p元素</p> </div> .wrap( function ) ：一个回调函数，返回用于包裹匹配元素的 HTML 内容或 jQuery 对象使用后的效果与直接传递参数是一样，只不过可以把代码写在函数体内部，写法不同而已以第一个案例为例： $('p').wrap(function() { return '<div></div>'; //与第一种类似，只是写法不一样 }) 注意： .wrap()函数可以接受任何字符串或对象，可以传递给$()工厂函数来指定一个DOM结构。这种结构可以嵌套了好几层深，但应该只包含一个核心的元素。每个匹配的元素都会被这种结构包裹。该方法返回原始的元素集，以便之后使用链式方法。

查看全部

0 采集收起来源：DOM包裹wrap()方法
2018-03-22
謿智i

DOM节点删除之empty和remove区别要用到移除指定元素的时候，jQuery提供了empty()与remove([expr])二个方法，两个都是删除元素，但是两者还是有区别 empty方法严格地讲，empty()方法并不是删除节点，而是清空节点，它能清空元素中的所有后代节点 empty不能删除自己本身这个节点 remove方法该节点与该节点所包含的所有后代节点将同时被删除提供传递一个筛选的表达式，删除指定合集中的元素

查看全部

0 采集收起来源：DOM节点删除之empty和remove区别
2017-06-13
謿智i

//找到所有p元素中，包含了3的元素 //这个也是一个过滤器的处理 $("p").remove(":contains('3')")

查看全部

0 采集收起来源：DOM节点删除之remove()的有参用法和无参用法
2018-03-22
謿智i

DOM节点删除之remove()的有参用法和无参用法 remove与empty一样，都是移除元素的方法，但是remove会将元素自身移除，同时也会移除元素内部的一切，包括绑定的事件及与该元素相关的jQuery数据。

查看全部

0 采集收起来源：DOM节点删除之remove()的有参用法和无参用法
2017-06-13
謿智i

DOM节点删除之empty()的基本用法 empty 顾名思义，清空方法，但是与删除又有点不一样，因为它只移除了指定元素中的所有子节点。

查看全部

0 采集收起来源：DOM节点删除之empty()的基本用法
2017-06-13
謿智i

insertAfter将JQuery封装好的元素插入到指定元素的后面，如果元素后面有元素了，那将后面的元素后移，然后将JQuery对象插入； insertBefore将JQuery封装好的元素插入到指定元素的前面，如果元素前面有元素了，那将前面的元素前移，然后将JQuery对象插入；

查看全部

0 采集收起来源：DOM外部插入insertAfter()与insertBefore()
2017-06-13
謿智i

append()向每个匹配的元素内部追加内容 prepend()向每个匹配的元素内部前置内容 appendTo()把所有匹配的元素追加到另一个指定元素的集合中 prependTo()把所有匹配的元素前置到另一个指定的元素集合中

查看全部

0 采集收起来源：DOM内部插入prepend()与prependTo()
2017-06-13
謿智i

append()前面是被插入的对象，后面是要在对象内插入的元素内容 appendTo()前面是要插入的元素内容，而后面是被插入的对象

查看全部

0 采集收起来源：DOM内部插入append()与appendTo()
2017-06-13
Flipped_Z

append()前面是被插入的对象，后面是要在对象内插入的元素内容 appendTo()前面是要插入的元素内容，而后面是被插入的对象

查看全部

0 采集收起来源：DOM内部插入append()与appendTo()
2017-06-13
淡水狗

DOM替换replaceWith()和replaceAll() .replaceWith( newContent )：用提供的内容替换集合中所有匹配的元素并且返回被删除元素的集合替换的内容可包括：HTML字符串，DOM元素，或者jQuery对象 $("p").replaceWith("<a>替换的新内容</a>") $("<a>替换的新内容</a>").replaceAll("p") replaceAll()和.replaceWith()功能类似，但是目标和源相反。总结： .replaceAll()和.replaceWith()功能类似，主要是目标和源的位置区别 .replaceWith()与.replaceAll() 方法会删除与节点相关联的所有数据和事件处理程序 .replaceWith()方法，和大部分其他jQuery方法一样，返回jQuery对象，所以可以和其他方法链接使用 .replaceWith()方法返回的jQuery对象引用的是替换前的节点，而不是通过replaceWith/replaceAll方法替换后的节点

查看全部

0 采集收起来源：DOM替换replaceWith()和replaceAll()
2018-03-22
淡水狗

DOM拷贝clone() .clone()方法深度复制所有匹配的元素集合，包括所有匹配元素、匹配元素的下级元素、文字节点。 HTML部分 <div></div> JavaScript部分 $("div").on('click', function() {//执行操作}) //clone处理一 $("div").clone() //只克隆了结构，事件丢失 //clone处理二 $("div").clone(true) //结构、事件与数据都克隆 clone()方法时，在将它插入到文档之前，我们可以修改克隆后的元素或者元素内容，如右边代码我 $(this).clone().css('color','red') 增加了一个颜色通过传递true，将所有绑定在原始元素上的事件处理函数复制到克隆元素上 clone()方法是jQuery扩展的，只能处理通过jQuery绑定的事件与数据元素数据（data）内对象和数组不会被复制，将继续被克隆元素和原始元素共享。深复制的所有数据，需要手动复制每一个

查看全部

0 采集收起来源：DOM拷贝clone()
2018-03-22
白小九

<B>.insertBefore(<A>)：在每个匹配元素A前插入内容B <B>.insertAfter(<A>)：在每个匹配元素A后插入内容B 【不支持多参数】

查看全部

0 采集收起来源：DOM外部插入insertAfter()与insertBefore()
2018-03-22

首页上一页 146 147 148 149 150 151 152 下一页尾页

0/150

提交

取消

开始学习

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

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