-
DOM替换replaceWith()和replaceAll() 之前学习了节点的内插入、外插入以及删除方法，这节会学习替换方法replaceWith .replaceWith( newContent )：用提供的内容替换集合中所有匹配的元素并且返回被删除元素的集合 简单来说：用$()选择节点A，调用replaceWith方法，传入一个新的内容B（HTML字符串，DOM元素，或者jQuery对象）用来替换选中的节点A 看个简单的例子：一段HTML代码 <div> <p>第一段</p> <p>第二段</p> <p>第三段</p> </div> 替换第二段的节点与内容 $("p:eq(1)").replaceWith('<a >替换第二段的内容</a>') 通过jQuery筛选出第二个p元素，调用replaceWith进行替换，结果如下 <div> <p>第一段</p> <a >替换第二段的内容</a>' <p>第三段</p> </div> .replaceAll( target ) ：用集合的匹配元素替换每个目标元素 .replaceAll()和.replaceWith()功能类似，但是目标和源相反，用上述的HTML结构，我们用replaceAll处理 $('<a >替换第二段的内容</a>').replaceAll('p:eq(1)') 总结： .replaceAll()和.replaceWith()功能类似，主要是目标和源的位置区别 .replaceWith()与.replaceAll() 方法会删除与节点相关联的所有数据和事件处理程序 .replaceWith()方法，和大部分其他jQuery方法一样，返回jQuery对象，所以可以和其他方法链接使用 返回的jQuery对象引用的是被删除的节点，而不是通过replaceWith/replaceAll方法替换的节点查看全部
-
console.log(1)的作用是在控制台日志写出一个1查看全部
-
用动态p标签插入时，会发现一个问题：他并没有插入到li中，结构是分散的。而用p标签插入的时候是真正的把p标签插入到li中作为一个整体。而且在用appendTo插入到其他位置后原始位置ui里面的节点和内容也消失了查看全部
-
add()方法 jQuery是一个合集对象，通过$()方法找到指定的元素合集后可以进行一系列的操作。$()之后就意味着这个合集对象已经是确定的，如果后期需要再往这个合集中添加一新的元素要如何处理？jQuery为此提供add方法，用来创建一个新的jQuery对象 ，元素添加到匹配的元素集合中 .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(目标位置)查看全部
-
HTML部分 <div></div> JavaScript部分 $("div").on('click', function() {//执行操作}) //clone处理一 $("div").clone() //只克隆了结构，事件丢失 //clone处理二 $("div").clone(true) //结构、事件与数据都克隆查看全部
-
detach方法是JQuery特有的，所以它只能处理通过JQuery的方法绑定的事件或者数据查看全部
-
这个方法不会把匹配的元素从jQuery对象中删除，因而可以在将来再使用这些匹配的元素。与remove()不同的是，所有绑定的事件、附加的数据等都会保留下来。 $("div").detach()这一句会移除对象，仅仅是显示效果没有了。但是内存中还是存在的。当你append之后，又重新回到了文档流中。就又显示出来了。查看全部
-
如果我们通过empty方法移除里面div的所有元素，它只是清空内部的html代码，但是标记仍然留在DOM中 //通过empty处理 $('.hello').empty() //结果：<p>慕课网</p>被移除 <div class="hello"></div>查看全部
-
detach(), remove()共同点: 1.移除被选元素，包括所有文本和子节点。 2.会保留 jQuery 对象中的匹配的元素，因而可以在将来再使用这些匹配的元素。 不同点: 1.detach()不会删除对象绑定的事件,附加的数据 2.remove(0会删除对象绑定的事件附件的数据 使用方法: 如果要删除对象上的事件用remove, 不删除用detach()查看全部
-
warpall() 给所有孩子找一个共同的爹 warp() 给所有孩子各找一个爹查看全部
-
remove表达式参数： remove比empty好用的地方就是可以传递一个选择器表达式用来过滤将被移除的匹配元素集合，可以选择性的删除指定的节点 我们可以通过$()选择一组相同的元素，然后通过remove（）传递筛选的规则，从而这样处理 对比右边的代码区域，我们可以通过类似于这样处理 $("p").filter(":contains('3')").remove()//:contains('3') 找到所有p元素中，包含了3的元素查看全部
-
jQuery基础(二)—DOM篇——each() Ps1：详情查看课件。 Ps2：一般类似包裹、删除、替换等DOM节点，返回值一般都是原始没被更新的DOM节点。 【温馨提示：JavaSE/EE、SSH/SSM、Hybrid APP、JQ/JS/CSS3/H5等编程爱好者关注我，加我慕课好友，互相学习，共同进步！】查看全部
-
jQuery基础(二)—DOM篇——add()方法 Ps：详情查看课件。 【温馨提示：JavaSE/EE、SSH/SSM、Hybrid APP、JQ/JS/CSS3/H5等编程爱好者关注我，加我慕课好友，互相学习，共同进步！】查看全部
-
jQuery基础(二)—DOM篇——siblings() Ps：详情查看课件。 【温馨提示：JavaSE/EE、SSH/SSM、Hybrid APP、JQ/JS/CSS3/H5等编程爱好者关注我，加我慕课好友，互相学习，共同进步！】查看全部
-
jQuery基础(二)—DOM篇——prev()方法 Ps：详情查看课件。 【温馨提示：JavaSE/EE、SSH/SSM、Hybrid APP、JQ/JS/CSS3/H5等编程爱好者关注我，加我慕课好友，互相学习，共同进步！】查看全部
举报
0/150
提交
取消