慕课网

jQuery基础(二)—DOM篇

最热最新

690017359

DOM外部插入after()与before() 选择器的描述： before与after都是用来对相对选中元素外部增加相邻的兄弟节点 2个方法都是都可以接收HTML字符串，DOM 元素，元素数组，或者jQuery对象，用来插入到集合中每个匹配元素的前面或者后面 2个方法都支持多个参数传递after(div1,div2,....) 可以参考右边案例代码注意点： after向元素的后边添加html代码，如果元素后面有元素了，那将后面的元素后移，然后将html代码插入 before向元素的前边添加html代码，如果元素前面有元素了，那将前面的元素前移，然后将html代码插 <script type="text/javascript"> $("#bt1").on('click', function() { //在匹配test1元素集合中的每个元素前面插入p元素 $(".test1").before('<p >before,在匹配元素之前增加</p>', '<p >多参数</p>') }) </script> <script type="text/javascript"> $("#bt2").on('click', function() { //在匹配test1元素集合中的每个元素后面插入p元素 $(".test2").after('<p >after,在匹配元素之后增加</p>', '<p >多参数</p>') }) </script>

查看全部

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

DOM内部插入append()与appendTo() 简单的总结就是： .append()和.appendTo()两种方法功能相同，主要的不同是语法——内容和目标的位置不同 append()前面是被插入的对象，后面是要在对象内插入的元素内容 appendTo()前面是要插入的元素内容，而后面是被插入的对象 <div class="content"></div> <script type="text/javascript"> $("#bt1").on('click', function() { //.append(), 内容在方法的后面， //参数是将要插入的内容。 $(".content").append('<div class="append">我是个天才！</div>') }) </script> <script type="text/javascript"> $("#bt2").on('click', function() { //.appendTo()刚好相反，内容在方法前面， //无论是一个选择器表达式或创建作为标记上的标记 //它都将被插入到目标容器的末尾。 $('<div class="appendTo">天才就是我！</div>').appendTo($(".content")) }) </script>

查看全部

0 采集收起来源：DOM内部插入append()与appendTo()
2018-03-22
立花叶泷

wrapInner()给指定的元素内部添加包裹元素

查看全部

0 采集收起来源：DOM包裹wrapInner()方法
2017-09-12
立花叶泷

wrapAll()给匹配的元素增加一个共同的父级元素，wrap是给每个元素添加父级结构

查看全部

0 采集收起来源：DOM包裹wrapAll()方法
2017-09-12
立花叶泷

wrap()给元素添加父级，unwrap()去除元素的父级

查看全部

0 采集收起来源：DOM包裹unwrap()方法
2017-09-12
立花叶泷

replaceWith()与replaceAll()都用来替换元素

查看全部

0 采集收起来源：DOM替换replaceWith()和replaceAll()
2017-09-12
回首已是千年

append：这个操作与对指定的元素执行原生的appendChild方法，将它们添加到文档中的情况类似。 appendTo：实际上，使用这个方法是颠倒了常规的$(A).append(B)的操作，即不是把B追加到A中，而是把A追加到B中。 .append()和.appendTo()两种方法功能相同，主要的不同是语法——内容和目标的位置不同 append()前面是被插入的对象，后面是要在对象内插入的元素内容 appendTo()前面是要插入的元素内容，而后面是被插入的对象

查看全部

0 采集收起来源：DOM内部插入append()与appendTo()
2017-09-12
回首已是千年

节点创建：常见的就是直接把这个节点的结构给通过HTML标记字符串描述出来，通过$()函数处理，$("html结构")

查看全部

0 采集收起来源：jQuery节点创建与属性的处理
2018-03-22
回首已是千年

创建元素：document.createElement 设置属性：setAttribute 添加文本：innerHTML 加入文档：appendChild

查看全部

0 采集收起来源：DOM创建节点及节点属性
2017-09-12
690017359

jQuery节点创建与属性的处理上一节介绍了通过JavaScript原生接口创建节点，在处理上是非常复杂与繁琐的。我们可以通过使用jQuery来简化了这个过程创建元素节点：可以有几种方式，后面会慢慢接触。常见的就是直接把这个节点的结构给通过HTML标记字符串描述出来，通过$()函数处理，$("html结构") $("<div></div>") 创建为本节点：与创建元素节点类似，可以直接把文本内容一并描述 $("<div>我是文本节点</div>") 创建为属性节点：与创建元素节点同样的方式 $("<div id='test' class='aaron'>我是文本节点</div>") 我们通过jQuery把上一届的代码改造一下，如右边代码所示一条一句就搞定了，跟写HTML结构方式是一样的 $("<div class='right'><div class='aaron'>动态创建DIV元素节点</div></div>") 这就是jQuery创建节点的方式，让我们保留HTML的结构书写方式，非常的简单、方便和灵活

查看全部

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

这节div left 和right 都设施了float:left为什么结果还是正常流仔细看看css部分，.right和.left都只是设置了width和height，浮动的是.right和.left内部的div。所以.right被添加到正常的文档流中 •创建元素：document.createElement •设置属性：setAttribute •添加文本：innerHTML •加入文档：appendChild var body = document.querySelector('body');这句什么意思在js中一种读取元素的方法，等同于document.getElementsByTagName('body')[0];

查看全部

0 采集收起来源：DOM创建节点及节点属性
2017-09-12
立花叶泷

empty与remove同为移除元素的方法，empty是移除元素内部的所有元素，本身不会被移除；而remove是连同本身一起被移除

查看全部

0 采集收起来源：DOM节点删除之remove()的有参用法和无参用法
2017-09-12
有无上涯

$("#bt1").on('click', function() { //在匹配test1元素集合中的每个元素前面插入p元素 $(".test1").before('<p >before,在匹配元素之前增加</p>', '<p >多参数</p>') }) </script> <script type="text/javascript"> $("#bt2").on('click', function() { //在匹配test1元素集合中的每个元素后面插入p元素 $(".test2").after('<p >after,在匹配元素之后增加</p>', '<p >多参数</p>') })

查看全部

0 采集收起来源：DOM外部插入after()与before()
2018-03-22
有无上涯

$("#bt1").on('click', function() { //.append(), 内容在方法的后面， //参数是将要插入的内容。 $(".content").append('<div class="append">通过append方法添加的元素</div>') }) $("#bt2").on('click', function() { //.appendTo()刚好相反，内容在方法前面， //无论是一个选择器表达式或创建作为标记上的标记 //它都将被插入到目标容器的末尾。 $('<div class="appendTo">通过appendTo方法添加的元素</div>').appendTo($(".content"))

查看全部

0 采集收起来源：DOM内部插入append()与appendTo()
2018-03-22
艾零

replaceWith()返回的是jQuery对象可以和其他方法连接使用但这时的作用的对象是被替换的节点

查看全部

0 采集收起来源：DOM替换replaceWith()和replaceAll()
2017-09-10

首页上一页 111 112 113 114 115 116 117 下一页尾页

0/150

提交

取消

开始学习

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

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