Question

我有第三方API响应，它向我发送JS和CSS，然后将其注入文档头。

＆＃xA;＆＃xA;

  Model.retrieve（） .then（res =＆gt; {＆＃xA; //注入DOM＆＃xA; if（res）{＆＃xA; $（“head”）。prepend（res.css）; //res.css would是＆lt; style＆gt;＆＃xA; $（“head”）。append（res.js）; //将是＆lt; script＆gt; ...＆lt; / script＆gt;＆＃xA; let div = document。 getElementById（'banner-outerwrap'）;＆＃xA; div.insertAdjacentHTML（'beforeend'，res.html）;＆＃xA;} else {＆＃xA; //无响应，进行清理。＆＃xA; }＆＃xA;}）＆＃xA;

＆＃xA;＆＃xA;

问题：

＆＃xA;＆＃xA ;

如果响应为空，我想清理/删除（CSS和JS）。（即不适用的用例）但我不知道如何在不刷新DOM的情况下使用jQuery。（我在directive.js中运行此代码，因此无法刷新DOM，我需要清理）

＆＃xA;＆＃xA;

任何见解都将受到赞赏。

＆＃XA;

Answer 1

要求

到目前为止，我所理解的是，您根据从API收到的文本响应，在文档中注入一个包含在<script>标记内的脚本，并希望在之后进行清理/删除。

问题

问题是<head>标记内可能有多个脚本，并且您没有跟踪注入的脚本，这样可以更灵活，更容易操作文档。

解决方案

为此，我希望您使用DocumentFragment函数createDocumentFragment。

诀窍在于，在注入脚本之前，您需要为<script>标记提供一些id或class，以便稍后在收到新响应时可以选择该标记而不是删除所有标签。

我将继续接收response，请说我们有以下回复

var response='<script>alert("hello all")<\/script>';

现在我们将上面的脚本标记作为文本为其分配class我们需要将其转换为节点，然后将其附加到documentFragment并为其分配新属性{{1然后将其附加到文档

class

完成后，您现在可以通过

轻松选择并删除脚本标记

//create a document fragment
let htmlFragment = document.createDocumentFragment();

//create a div element to hold the response
let tempNode = document.createElement('div');

//add response to the div
tempNode.innerHTML = response;

//append the <script> tag from the div to the fragment
htmlFragment.appendChild(tempNode.firstChild);

//select script tag from the fragment now
let scriptTag = htmlFragment.querySelector('script');

//add class to the <script> tag
scriptTag.setAttribute('class', 'removeables');

//append the tag to the document body
$(document.body).append(fragment);

下面给出了上面的一个工作示例，它在页面加载时注入脚本标记，然后在单击按钮$('.removeables').remove();时删除脚本标记，您可以打开HTML检查器并查看。

我已经创建了一个功能delete，您可以将updateTags(response)响应传递给它，它会返回<script>您可以使用documentfragment或{{1}添加的内容}。

＆＃13;

jquery

＆＃13;

javascript

＆＃13;

如何从DOM中删除特定的<script>和<style>标记

1 个答案:

要求

问题

解决方案