在正确的位置向HTML动态添加标记

Question

在HTML文件的某个地方，我们有这样的：

<script SRC="story_content/user.js" TYPE="text/javascript"></script>

如果我们想动态地(Javascript是首选，JQuery是可接受的(添加另一个脚本标签或CSS链接

说明：我们需要通过SRC选择脚本标记，并且需要在脚本标记之后添加标记。

以下是我们需要在脚本标签之后添加的标签

<link rel="stylesheet" href="../../../sources/main.min.css" data-noprefix />
<link rel="stylesheet" href="html5/data/css/output.min.css" data-noprefix />
<script data-main="app/scripts/init.generated" src="../../../sources/app.min.js"></script>

Answer 1

您可以使用查询选择器在纯js中获取目标，如：

var source_name = "story_content/user.js"              // path of file
var add_to = document.querySelector(`script[src=${source_name}]`);

一旦add_to被存储，你就应该能够添加标签，比如：

var to_be_added_tag = document.CreateElement("script");
to_be_added_tag.setAttribute("src", src_path_of_your_file); // src_path_of_your_file is variable, value of src attribute
add_to.after(to_be_added_tag);   

*注意：-after用于在某个节点后添加元素。参考