首页 > 其他分享 >元素操作(克隆、插入指定位置)

元素操作(克隆、插入指定位置)

时间:2023-09-19 12:12:34浏览次数:38  
标签:克隆 创建 元素 指定 插入 oDiv3 div id

元素克隆

    var sourceNode = document.getElementById("div-0"); // 获得被克隆的节点对象   
    var clonedNode = sourceNode.cloneNode(true); // 克隆节点   
    clonedNode.setAttribute("id", "div-" + i); // 修改一下id 值,避免id 重复   

参考文献:https://blog.csdn.net/yuyecsdn/article/details/89636630

指定位置插入元素

<div id=”divs”>
<div id=”div1″>div1</div>
<div id=”div2″>div2</div>
</div>

<script>
var oDivs=document.getElementById(‘divs’);
var oDiv2=document.getElementById(‘div2′); //获取到div2,因为等下要把创建的div插入到div2前面。

var oDiv3=document.createElement(‘div’); //创建一个div元素。
oDiv3.id=’div3′; //id样式可以先在样式表中写好,然后赋值一个id给创建出来的div元素。
oDiv3.innerHTML=’<span>这是被创建出来的div3</span>’; //给创建出来的div添加内容,内容中可以有html标签嵌套。

oDivs.insertBefore(oDiv3,oDiv2); //在大的div元素下插入创建出来的元素,第一个参数是创建的div,第二个参数是要插入到哪个div前面。

oDivs.insertBefore(oDiv3,oDiv2.nextSibling); //在大的div元素下插入创建出来的元素,第一个参数是创建的div,第二个参数是要插入到哪个div后面。
<script>

例如:使用  oDivs.insertBefore(oDiv3,oDiv2.nextSibling);

 

参考文献:http://blog.unvs.cn/archives/js-insertbefore-add-div.html

标签:克隆,创建,元素,指定,插入,oDiv3,div,id
From: https://www.cnblogs.com/ZhuMeng-Chao/p/17714274.html

相关文章

  • destoon上做纯js实现html指定页面导出word
    因为最近做了范文网站需要,所以要下载为word文档,如果php进行处理,很吃后台服务器,所以想用前端进行实现。查询github发现,确实有这方面的插件。js导出word文档所需要的两个插件:FileSaver.jsjquery.wordexport.js首先引入:<!--生成word!--><scriptsrc="https://cdn.bootcss......
  • @Validated指定校验顺序
    在Java中,使用@NotNull注解时,可以指定多个参数的顺序。为了指定顺序,你可以使用@GroupSequence注解。首先,为每个需要校验的参数定义一个接口,并在接口上添加@GroupSequence注解,指定参数的校验顺序。然后,在每个参数上使用@NotNull注解。下面是一个示例代码:javaimportjavax.valida......
  • 将图片插入到SQL Server数据库
    --新建表imagecreatetableimage(img_idint,imgimage) 拖控件TADOQuery包含Jpeg.hpp//存入图片://image以二进制形式存放图片ADOQuery1->Close();ADOQuery1->SQL->Clear();ADOQuery1->SQL->Add("insertintoimagevalues(:img_id,:img)");ADOQuery1->Paramet......
  • 更改SQL Server sa密码、默认端口 以及ADO连接字符串指定端口号
    1、更改sa密码execsp_passwordnull,'000','sa'--将sa密码改为0002、更改SQLSERVER默认端口     (1)SqlServer服务使用两个端口:TCP-1433、UDP-1434。其中1433用于供SqlServer对外提供服务,1434用于向请求者返回SqlServer使用了那个TCP/IP端口。可以使用SQLServer的企业管......
  • 指定请求头部爬取知乎网
    1、获取知乎网的url2、检查后台--获取header信息3、获取json数据4、输出数据......
  • SQL系列4-插入更新与删除
    SQL系列4-插入更新与删除✅下面是许多SQL程序员使用UPDATE或DELETE时所遵循的重要原则。除非确实打算更新和删除每一行,否则绝对不要使用不带WHERE子句的UPDATE或DELETE语句。保证每个表都有主键(如果忘记这个内容,请参阅第12课),尽可能像WHERE子句那样使用它(......
  • SQL 将查询结果插入到另一张表中
    INSERTINTO如果两张表(导出表和目标表)的字段一致,并且希望插入全部数据,可以用这种方法:INSERTINTO目标表SELECT*FROM来源表WHERE条件;例如,要将test表插入到newTest表中,则可以通过如下SQL语句实现:INSERTINTOnewTestSELECT*FROMtest;如果只希望导入指定......
  • Navicat连接SQLServer提示:未发现数据源名并且未指定默认驱动程序
    问题:Navicat连接SQLServer提示:未发现数据源名并且未指定默认驱动程序解决方式一:可以直接安装Navicat根目录(安装目录)下的sqlncli.msi(32位)或sqlncli_x64.msi(64位) 双击开始安装,一直下一步,正常安装完成的话,重启下Navicat就没有问题了,可以正常连接了。解决方式一:在官......
  • Python 压缩图片至指定大小
    @https://www.cnblogs.com/jum-bolg/p/13796595.htmlimportbase64importioimportosfromPILimportImagefromPILimportImageFile#压缩图片文件defcompress_image(outfile,mb=600,quality=85,k=0.9):"""不改变图片尺寸压缩到指定大小:paramoutfile......
  • vs打开项目出现“尚未配置为Web项目XXXX指定的本地IIS URL HTTP://localhost:…… .要
    用把工程文件(.vcxproj文件打开找到如下代码片段 ,请将下面片段代码中的(最好用notepad++打开)<UseIIS>True</UseIIS>、<AutoAssignPort>True</AutoAssignPort>节点的值改为False<WebProjectProperties><UseIIS>True</UseIIS><AutoAssignPor......