关于insertBefore是怎么使用的

关于insertBefore是怎么使用的insertBefore接收两个参数第一个参数是将要进行插前操作的对象第二个参数是被插前的对象也可以称为参考对象调用者为你要操作的元素的父级如下例:<!DOCTYPE ht

大家好,又见面了,我是你们的朋友全栈君。

insertBefore接收两个参数 第一个参数是将要进行插前操作的对象 第二个参数是被插前的对象  也可以称为参考对象

   调用者为你要操作的元素的父级  如下例:

<!DOCTYPE html>
<html lang=”en”>

<head>
  <meta charset=”UTF-8″>
  <meta name=”viewport” content=”width=device-width, initial-scale=1.0″>
  <title>Document</title>
</head>

<body>
  <div>
    <p>张无忌</p>
    <p>张三丰</p>
  </div>

  <script>
    var p1 = document.getElementsByTagName(‘p’)[0]
    var p2 = document.getElementsByTagName(‘p’)[1]
    var div = document.getElementsByTagName(‘div’)[0]
    let newReturn = div.insertBefore(p2, p1)
    console.log(newReturn === p2);
  </script>
</body>

</html>
学会了这个例子  你就掌握了InsertBefore的用法了 下期我会带大家封装一个原生dom里没有的insertAfter的函数,请关注前端小曹!谢谢支持,下期见
版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/155237.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • ModelSim安装破解出现Unable to checkout a license.Make sure you licence file…..错误

    ModelSim安装破解出现Unable to checkout a license.Make sure you licence file…..错误说了你们可能不信,装ModelSim软件,今天整整装了一天才弄好,一直出现下面的错误。下面详细说一下解决这个问题的办法:方法一:不正面解决这个问题在FPGA做仿真的时候,可以不需要单独破解版的ModelSim,直接使用Quartus软件自带的ModelSim-Altrea安装上面两个软件,然后在仿真的时候,路径设置对就可以这个时候,你安装的ModelSim在桌面的图标你可以发现是叫ModelSim-Altrea方法二:正面解决这个问题如果你跟我一样,非要安装独立的版本,当你遇到这个问题的

    2022年5月12日
    54
  • 手机分辨率分类「建议收藏」

    手机分辨率分类「建议收藏」1、VGA(640×480)分辨率,(VideoGraphicsArray)是IBM在1987年随PS/2机一起推出的一种视频传输标准,具有分辨率高、显示速率快、颜色丰富等优点,在彩色显示器领域得到了广泛的应用。主要基于VGA显示卡的计算机、笔记本等设备,而在一些既要求显示彩色高分辨率图像又没有必要使用计算机的设备上,VGA技术的应用却很少见到。2、QVGA即”Quarter

    2022年8月13日
    2
  • element-ui中表格获取当前行的索引index[通俗易懂]

    element-ui中表格获取当前行的索引index[通俗易懂]前言弄文件上传时,需要对上传列表的文件进行一定的操作,例如暂停/取消等等,因为我是使用element-ui中表格展示上传文件列表的,这时的操作却需要使用到当前行的索引下,如何获取索引就是我接下来要做的工作了:获取当前行的索引index使用scope.$index,scope.row即可实现获取索引<el-table-columnlabel=”排序”min-width=”100″><templateslot-scope=”scope”>{{sco

    2025年8月29日
    5
  • vmware15激活码【2021.8最新】

    (vmware15激活码)这是一篇idea技术相关文章,由全栈君为大家提供,主要知识点是关于2021JetBrains全家桶永久激活码的内容IntelliJ2021最新激活注册码,破解教程可免费永久激活,亲测有效,下面是详细链接哦~https://javaforall.net/100143.html70YZDJVTFP-eyJsa…

    2022年3月26日
    111
  • python基础(5)字典「建议收藏」

    python基础(5)字典「建议收藏」字典字典的key和value一一对应的,字典是可变的,也是有序的(python3.6版本开始字典有序),可迭代的增加元素当key不存在时,直接赋值a={"status"

    2022年7月28日
    4
  • 滚动条样式全局修改

    滚动条样式全局修改滚动条样式是当前浏览器的样式,以webkit内核为准。改的全局样式。不单单是elementUI样式新建一个reset.scss//border-radius圆角/*设置滚动条的样式*/

    2022年7月1日
    25

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号