jquery内部插入与外部插入

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"        "http://www.w3.org/TR/html4/loose.dtd"><html><head>    <title>文档处理</title>    <script src="jquery-3.4.1.js"></script></head><body><a>click</a><div id="div1">    <div>first</div>

</div><p>hello p</p><script>//一:内部插入    //1.(1)append()方法,将p标签插入到div标签里面,(成为最后一个孩子)//    var ele=$(‘p‘);//    $(‘#div1‘).append(ele);    //(2)将p标签插入到div标签里面,(成为最后一个孩子)----(调用对象不一样)//    var ele=$(‘p‘);//    ele.appendTo($(‘#div1‘))

    //2.(1)prepend()方法,将p标签插入到div标签里面,(成为第一个孩子)//    var ele2=$(‘p‘);//    $(‘#div1‘).prepend(ele2);    //(2)将p标签插入到div标签里面,(成为第一个孩子)----(调用对象不一样)//    var ele2=$(‘p‘);//    ele2.prependTo($(‘#div1‘));

    //二:外部插入        //1.(1)after()方法,将p标签插入到div标签后面,和div并列为兄弟//    var ele1=$(‘a‘);//    $(‘div‘).after(ele1);//(2).insertAfter()方法,将p标签插入到div标签后面,和div并列为兄弟//    var ele1=$(‘a‘);//    ele1.insertAfter($(‘#div1‘));    //2.(1)before()方法,将p标签插入到div标签前面,和div并列为兄弟//    var ele2=$(‘p‘)//    $(‘#div1‘).before(ele2);    //(2).insertBefore()方法,将p标签插入到div标签前面,和div并列为兄弟//    var ele2=$(‘p‘);//    ele2.insertBefore($(‘#div1‘));

    //clone()方法    var e=$(‘div p‘);    var ele=e.clone();    //然后对克隆对象进行操作

</script>

</body></html>

原文地址:https://www.cnblogs.com/startl/p/12302721.html

时间: 2024-08-01 22:29:48

jquery内部插入与外部插入的相关文章

DOM—外部插入.after()、.before()、.insertAfter()和.insertBefore()与内部插入.prepend()和.prependTo()

外部插入.after()..before()..insertAfter()和.insertBefore()与内部插入.prepend()和.prependTo() 1   .after(content)在匹配元素集合中的每个元素后面插入参数所指定的内容,作为其兄弟节点 2   .before(content)据参数设定,在匹配元素的前面插入内容 3   .after()和.before()共同点 都是用来对相对选中元素外部增加相邻的兄弟节点 都可以接收HTML字符串.DOM元素.元素数组,或者J

[ jquery 文档处理 prepend(content|fn) ] 此方法用于向每个匹配的元素内部前置内容,这是向所有匹配元素内部的开始处插入内容的最佳方式

向每个匹配的元素内部前置内容,这是向所有匹配元素内部的开始处插入内容的最佳方式 实例: <html lang='zh-cn'> <head> <title>Insert you title</title> <meta http-equiv='description' content='this is my page'> <meta http-equiv='keywords' content='keyword1,keyword2,keywor

DOM外部插入insertAfter()与insertBefore()

DOM外部插入insertAfter()与insertBefore() 与内部插入处理一样,jQuery由于内容目标的位置不同,然增加了2个新的方法insertAfter与insertBefore .before()和.insertBefore()实现同样的功能.主要的区别是语法--内容和目标的位置. 对于before()选择表达式在函数前面,内容作为参数,而.insertBefore()刚好相反,内容在方法前面,它将被放在参数里元素的前面 .after()和.insertAfter() 实现同

DOM外部插入after()与before()

DOM外部插入after()与before() 节点与节点之前有各种关系,除了父子,祖辈关系,还可以是兄弟关系.之前我们在处理节点插入的时候,接触到了内部插入的几个方法,这节我们开始讲外部插入的处理,也就是兄弟之间的关系处理,这里jQuery引入了2个方法,可以用来在匹配I的元素前后插入内容 选择器的描述: before与after都是用来对相对选中元素外部增加相邻的兄弟节点 2个方法都是都可以接收HTML字符串,DOM 元素,元素数组,或者jQuery对象,用来插入到集合中每个匹配元素的前面或

DOM常用外部插入方法与区别

1.DOM外部插入after()与before() 节点与节点之前有各种关系,除了父子,祖辈关系,还可以是兄弟关系.之前我们在处理节点插入的时候,接触到了内部插入的几个方法,这节我们开始讲外部插入的处理,也就是兄弟之间的关系处理,这里jQuery引入了2个方法,可以用来在匹配I的元素前后插入内容. 选择器 描述 .after(content) 在匹配选择器的每个元素之后插入内容(作为兄弟节点) .before(content) 方法在匹配选择器的元素之前插入内容(作为兄弟节点) before与a

[jQ]使用jQuery将多条数据插入模态框的方法

------------------------------------------------------------------------------------------------------ //Bootstrap模态框(局部) <div class="modal fade" id="orderDetail"> <div class="modal-dialog"> <div class="mo

16.外部插入

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>02_外部插入节点.html</title> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <script ty

测开之路一百零三:jquery元素和标签的插入与删除

标签内插入 标签外插入 给标签加标签 !DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>元素和标签插入</title> <script src="https://cdn.bootcss.com/jquery/2.2.4/jquery.min.js"></script><

Hive探秘--内部表、外部表、分区表、桶表研究

Hive知识 一.建表语法 CREATE [EXTERNAL] TABLE [IF NOT EXISTS] table_name [(col_name data_type [COMMENT col_comment], ...)] [COMMENT table_comment] [PARTITIONED BY (col_name data_type [COMMENT col_comment], ...)] [CLUSTERED BY (col_name, col_name, ...) [SORTE