jQuery - 点击时动态删除头部元素

Question

有人知道如何在按钮点击时移除头元素，并如何使用jQuery实现吗？

我正在尝试在单击按钮时从html头部中删除某些脚本标记。 例如，我有一个屏幕视图，由外部JavaScript文件控制的幻灯片。当我单击“单击以去除此元素JS”按钮时，我希望从HTML头部中删除外部JavaScript路径。

有什么想法吗？已经尝试了一周左右。

- ClosDesign

---

奇怪。为什么你想要删除脚本时却要包含它？我猜，你无法控制该页面的渲染。 - simplyharsh

Answer 1

您可以给脚本元素添加一个ID，然后删除该ID：

<script type="text/javascript" src="init.js" id="initJs" ></script>

<span id="removeScript"></span>

$('#removeScript').click(function() {
     $('#initJs').remove();
});

- HandiworkNYC.com

---

谢谢。我已经搜索了一个小时，这是唯一有效的解决方案。 - Eric Leroy

Answer 2

我认为删除整个HEAD元素不是一个好主意。因为您的页面可能包含其他附加到HEAD元素的元素（例如标题、样式等）。如果您想删除特定的script元素，请执行以下操作：

$(function() {
  $('input[type=button]').click(function() {
      $('script[src=path/file.js]').remove();
  });
});

编辑：

var flag = false;
function breakTheCode() {
    if(!flag) {
        //run your code
    }else return;
 }

$(function() {
  $('input[type=button]').click(function() {
      flag = true; //flag is set, so we no more using/ running your code
      breakTheCode(); //call you function/method
  });
});

- user372551

---

这会取消设置在path/file.js中定义的变量和函数吗？ - KeatsKelleher

@akellehe 为什么不自己运行这个测试呢？据我所知，在大多数浏览器中，外部资源都会被保留在内存中，无论它们在 DOM 中发生了什么。在某些外部脚本中设置一个变量，运行 Avinash 发布的卸载函数，然后打开控制台并执行 alert(myVariable)。我敢打赌你的变量将会弹出，但你应该亲自测试一下。 - treeface

@treeface，你能再解释一下吗？就像你提到的那样，我尝试了Avinash的想法，但并没有完全奏效。所以，是否有可能从DOM中删除脚本标签，并强制停止脚本运行呢？ - ClosDesign

@carols，就像treeface所说的那样，当您的内容被下载时，所有代码都存储在浏览器内存中。尽管您已经动态地删除了该元素，但浏览器缓存仍然包含您的文件内容，即您的变量、函数等。据我所知，在任何支持文件/数据缓存的浏览器中实现您的要求都很困难，我承认我的答案无法满足您的需求，抱歉 =) - user372551

@carlos，你要明白，从浏览器内存中删除已经存储的内容是不可能的。如果你仍然想要这样做，我建议你将代码封装在一个“函数”中，当用户点击按钮时，只需将标志（条件）设置为false/true，并通过不执行代码块来从函数中返回。 - user372551

Answer 3

您可以使用JavaScript来做这种事情，但在操作之前，您可能需要再次问问自己为什么。以下链接介绍了如何使用纯JavaScript进行此操作，并提供了其他回答者提供的jquery示例：http://www.javascriptkit.com/javatutors/loadjavascriptcss2.shtml。

但请记住，大多数现代浏览器将至少在页面打开的时间内将这些外部资源保存在内存中。因此，您实际上不会做太多事情。

- treeface

Answer 4

删除JS文件：$("script[src='your.js']").remove();

- Anup

Answer 5

对于我来说，最好的解决方案是在脚本中使用ID。 我阅读了许多网页，尝试了许多解决方案，唯一一个每次都能正常工作的方法就是像删除带有ID的div一样删除脚本！

- Fabien