在前一个脚本独立后添加脚本标记行

Question

我使用以下代码在现有封闭脚本标签之后添加脚本标签（通过代码在 html 文件中添加新脚本标签）

return '\n' + "<script>\n" + '\t' + scriptContent + "\n</script>\n";

(脚本内容为helloworld

html 内容如下

我希望第二个开始脚本标记位于封闭脚本标记之后（在第一行）我该怎么做？第一个'\n'在这里没有帮助...

它在我添加 br 时正常工作，我怎样才能删除这个 exact br如果这是我这里唯一的解决方案...

return "<br />" +"\n" +"<script>\n" + '\t' + scriptContent + "\n</script>\n";

请看下面的js fiddle点击转换后两个脚本标签都没有缩进...

请查看以下 jsFiddle（与我使用的类似，从 SO 中获取作为参考）

JSFiddle

jsfiddle.net/rd0mn3wh/1

正如您在单击 convert 两个脚本对象时看到的那样，其中没有 indented（新脚本和现有脚本），我该如何处理它，或者也许有更好的方法来处理它？

我希望新脚本像下面这样添加（带有警报的脚本...

....
ui-resourceroots="{'tdrun': './'}">
     </script>
      <script>
           alert("test");
      </script>

我需要以下内容：

Insert a new script after provided script ID(in the code after test-ui-bootstrap')

update attribute value (when

the key is provided)

以下两个答案在这里都无济于事...

Answer 1

这个怎么样:

return "\n<script>\n\t" + scriptContent + "\n</script>\n";

Answer 2

问题与 returned 字符串的处理位置有关。

\n、\r、\t 等都是 JavaScript 字符串转义码，因此，它们仅在字符串被JavaScript 运行时。如果你有一个包含这些代码的 JavaScript 字符串并将该字符串传递给 HTML 解析器（例如通过 .innerHTML），那么 HTML 解析器将被要求评估该字符串，在 HTML 解析器的世界中，<br> 是您添加换行符的方式，而不是 \n。这就是 <br> 对您有用的原因。

所以，当 \n 被 JavaScript 引擎评估时，一个换行符被注入到字符串中，但是当 HTML 解析器得到那个换行符时，它只是忽略它，就像标记中的任何回车 return 一样。

在过去，我们可以通过注入 document.writeln() 来获得此 "pretty" 代码，这将写入您的内容，然后在 HTML 中添加一个换行符。今天你仍然可以这样做，但这不是一个好的做法，因为它要求你在 HTML 文档中插入内联代码，否则你将覆盖整个 DOM.

如果这是你想要的东西，因为它会让你感到温暖和模糊，我建议忘记它并继续前进。

最后，这里是 DOM 创建新元素并将它们注入 DOM 的标准方法：

var o = document.getElementById("output");
var scriptContent = "alert('Hello World!')";
var s = document.createElement("script");
var t = document.createTextNode(scriptContent);
s.appendChild(t);
o.appendChild(s);

<div id="output">

</div>

Answer 3

问题是 .insertAfter() 正在从您的 HTML 字符串中修剪前导白色-space。解决方案是使用 .after() 代替。我通过玩你的 fiddle 解决了这个问题，这里是 updated fiddle。

在前一个脚本独立后添加脚本标记行

add script tag line after the previous script indetend

html

javascript

jquery

dom

mustache