慕课网

jQuery基础(二)—DOM篇

最热最新

听风吹牛

empty方法严格地讲，empty()方法并不是删除节点，而是清空节点，它能清空元素中的所有后代节点 empty不能删除自己本身这个节点 remove方法该节点与该节点所包含的所有后代节点将同时被删除提供传递一个筛选的表达式，删除指定合集中的元素

查看全部

0 采集收起来源：DOM节点删除之empty和remove区别
2017-07-06
听风吹牛

//找到所有p元素中，包含了3的元素 //这个也是一个过滤器的处理 $("p").remove(":contains('3')") $("p").filter(":contains('3')").remove()中的fliter filter() 方法将匹配元素集合缩减为匹配指定选择器的元素。这里就是先找出全部p标签后再找出文本中包含3的移除掉；

查看全部

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

empty()：移除指定元素中的所有子节点（包括元素的文本）,本身还在。

查看全部

0 采集收起来源：DOM节点删除之empty()的基本用法
2017-07-06
听风吹牛

before()和.insertBefore()实现同样的功能。主要的区别是语法——内容和目标的位置。对于before()选择表达式在函数前面，内容作为参数，而.insertBefore()刚好相反，内容在方法前面，它将被放在参数里元素的前面 .after()和.insertAfter() 实现同样的功能。主要的不同是语法——特别是（插入）内容和目标的位置。对于after()选择表达式在函数的前面，参数是将要插入的内容。对于 .insertAfter(), 刚好相反，内容在方法前面，它将被放在参数里元素的后面 before、after与insertBefore。insertAfter的除了目标与位置的不同外，后面的不支持多参数处理注意事项： insertAfter将JQuery封装好的元素插入到指定元素的后面，如果元素后面有元素了，那将后面的元素后移，然后将JQuery对象插入； insertBefore将JQuery封装好的元素插入到指定元素的前面，如果元素前面有元素了，那将前面的元素前移，然后将JQuery对象插入；外部插入 $('<p >测试insertBefore方法增加</p>', '<p >多参数</p>').insertBefore($(".test1")) $('<p >测试insertAfter方法增加</p>', '<p >多参数</p>').insertAfter($(".test2")) 内部插入 $(".test1").before('<p >before、,在匹配元素之前增加</p>', '<p >多参数</p>') $(".test2").after('<p >after,在匹配元素之后增加</p>', '<p >多参数</p>')

查看全部

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

append()向每个匹配的元素内部追加内容 appendTo()把所有匹配的元素追加到另一个指定元素的集合中前两个实在外部插入 prepend()向每个匹配的元素内部前置内容 prependTo()把所有匹配的元素前置到另一个指定的元素集合中这两个实在内部插入 $(".content").append('<div class="append">通过append方法添加的元素</div>') $('<div class="appendTo">通过appendTo方法添加的元素</div>').appendTo($(".content")) $('.aaron1').prepend('<p>prepend增加的p元素</p>') $('<p>prependTo增加的p元素</p>').prependTo($('.aaron2'))

查看全部

0 采集收起来源：DOM内部插入prepend()与prependTo()
2018-03-22
听风吹牛

$('element').after(content)像element元素后面添加内容 $('element').before(content)像element元素前面添加内容

查看全部

0 采集收起来源：DOM外部插入after()与before()
2017-07-06
听风吹牛

append 在父元素里的最后插入新创建的元素 appendTo 被插入的内容在前，插在父元素下创建节点需要$("里面写html代码") 但是在插入时可以省略$("")

查看全部

0 采集收起来源：DOM内部插入append()与appendTo()
2018-03-22
听风吹牛

on() 方法在被选元素及子元素上添加一个或多个事件处理程序。"

查看全部

0 采集收起来源：jQuery节点创建与属性的处理
2018-03-22
qq_vegetarian_1

.right加个css 是一个模块 appendTo往后面加只调取li

查看全部

0 采集收起来源：jQuery遍历之add()方法
2017-07-05
5E

以打印出时间的方式判断新追加的元素在最前或最后被追加。 $("#bt1").on('click', function() { var mydate = new Date(); //在test1元素前后插入集合中每个匹配的元素 //不支持多参数 $('<p >测试insertBefore方法增加<span class="greenbg label">'+mydate+'</span></p>', '<p >多参数</p>').insertBefore($(".test1")) }) </script> <script type="text/javascript"> $("#bt2").on('click', function() { var mydate = new Date(); //在test2元素前后插入集合中每个匹配的元素 //不支持多参数 $('<p >测试insertAfter方法增加<span class="yellowbg label">'+mydate+'</span></p>', '<p >多参数</p>').insertAfter($(".test2")) }) </script>

查看全部

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

用打印出时间的方式，就明显看出prepend()/prependTo()与append()/appendTo()的不同之处了。一个在最前追加，一个在最后追加。 <script type="text/javascript"> $("#bt1").on('click', function() { var myDate = new Date(); //找到class="aaron1"的div节点 //然后通过prepend在内部的首位置添加一个新的p节点 $('.aaron1') .prepend('<p>prepend增加的p元素<span >'+myDate+'</span></p>') }) </script> <script type="text/javascript"> $("#bt2").on('click', function() { var myDate = new Date(); //找到class="aaron2"的div节点 //然后通过prependTo内部的首位置添加一个新的p节点 $('<p>prependTo增加的p元素<span >'+myDate+'</span></p>') .prependTo($('.aaron2')) }) </script>

查看全部

1 采集收起来源：DOM内部插入prepend()与prependTo()
2018-03-22
WEB前端3437195

.parents() 找长辈(直接遍历到根元素,可能返回零个或一个或多个元素) 之前的： .detach() 隐身 .remove 自杀 .empty 身体被掏空 .clone 复制（true全复制 false 浅复制，无事件） .replaceWith 删除并替换节点（结合.replaceAll()来记） .wrap 每个人加个爸爸 .unwrap 爸爸没了 .wrapAll 所有人加个爸爸 .wrapAll（function）每个人加个爸爸 .wrapInner 加个儿子 .children() 找儿子 .find() 找后代 .parent() 找爸爸

查看全部

0 采集收起来源：jQuery遍历之parents()方法
2017-07-05
WEB前端3437195

.wrap 每个人加个爸爸之前的： .append 最后面加个兄弟 (结合appendTo()来记) .prepend 最前面加个兄弟(prependTo()来记) .before 我的前面加个兄弟(结合insertBefore来记) .after我的后面加个兄弟(结合insertAfter()来记) .detach() 隐身 .remove 自杀 .empty 身体被掏空 .clone 复制（true全复制 false 浅复制，无事件） .replaceWith 删除并替换节点（结合.replaceAll()来记）

查看全部

0 采集收起来源：DOM包裹wrap()方法
2017-07-05
卯目

DOM包裹wrap()方法如果要将元素用其他元素包裹起来，也就是给它增加一个父元素，针对这样的处理，JQuery提供了一个wrap方法 .wrap( wrappingElement )：在集合中匹配的每个元素周围包裹一个HTML结构简单的看一段代码： <p>p元素</p> 给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
卯目

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对象，所以可以和其他方法链接使用 .replaceWith()方法返回的jQuery对象引用的是替换前的节点，而不是通过replaceWith/replaceAll方法替换后的节点

查看全部

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

首页上一页 139 140 141 142 143 144 145 下一页尾页

0/150

提交

取消

开始学习

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

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