如何在当前js元素前插入其他元素？_编程技术网-程序员技术内容聚合平台

（在说正事之前，我要推荐一个福利：你还在原价购买阿里云、腾讯云、华为云服务器吗？那太亏啦！来这里，新购、升级、续费都打折，能够为您省60%的钱呢！2核4G企业级云服务器低至69元/年，点击进去看看吧>>>)

<!DOCTYPE?html>
<html?lang="zh-CN">
<head>
????<meta?charset="UTF-8">
????<meta?name="viewport"?content="width=device-width,?user-scalable=no,?initial-scale=1.0,?maximum-scale=1.0,?minimum-scale=1.0">
????<meta?http-equiv="X-UA-Compatible"?content="ie=edge">
????<title>Document</title>
</head>
<body>
    ...
    其他元素
    ...
    
    要插入元素在这个位置
????<script?src="./script.js"></script>
</body>
</html>

就比如上面的代码

我在js文件里面写了代码要创建元素，必须要插入在当前的js元素之前

有没有知道如何做？望指教一下，谢谢!

###

给script一个id或者class都可，当然如果只有一个script也可以直接用标签选择器，能select即可。

var $script = document.querySelector('#insert_script')
var $el = document.createElement('div')
$el.textContent = 'insert element';

// 方法一：
// $script.parentElement.insertBefore($el, $script)
// 方法二：
$script.insertAdjacentElement('beforebegin', $el)

###

多说几句吧。这个问题你要这么分析：

找到插入的元素
创建新元素
插入

先说（1）。JS 无法判断自身在哪个节点，所以你有两个选择：1. 给当前节点加标记；2. 查找最后一个 <script>。

（2）比较简单，直接 document.createElement()。（3）也简单，找到父元素，insertBefore()。

最终代码大约是：

const newElement = document.createElement('div');
// 采用方案二
const scripts = document.getElementsByTagName('script');
const script = scripts[scripts.length - 1];
const parent = script.parentElement;
parent.insertBefore(newElement, script);