【问题标题】:How to remove script tag from html using javascript [closed]如何使用javascript从html中删除脚本标签[关闭]
【发布时间】:2015-10-12 07:44:38
【问题描述】:

我正在尝试使用 JavaScript 从 Html 代码中删除脚本标记。 这是 HTML 代码:

<script type='text/x-template-handlebars' id='carousel_ui_buttons_next-nav_next'>
<button class="next nav" asg-button>{{{button_text}}}</button>
</script>

我想删除脚本标签,所以剩下的部分只是 html。 我的意思是应该在浏览器中更改代码。

【问题讨论】:

  • 您是要求将&lt;script&gt; 标记内的HTML 保留在原位,还是要求删除整个块?
  • 什么时候需要移除脚本标签?文档何时加载?当一个按钮被点击?请详细解释:)
  • 为什么需要移除脚本标签?
  • 我只想删除
  • 脚本元素的内容是无效脚本。投票结束,因为不清楚 OP 的要求是什么。此外,OP 可以利用许多类似的问题。

标签: javascript html


【解决方案1】:

如果您向我们提供您当前必须的代码来帮助您了解发生的事情会更好,而不是使用代码复制/粘贴来触发您首先决定何时启动的 js 代码

页面何时完成加载?

$(window).load(function() {
    $('#carousel_ui_buttons_next-nav_next').remove();
});

或者当页面准备好时

$(document).ready(function($) {
    $('#carousel_ui_buttons_next-nav_next').remove();
});

或者,如果您愿意,可以将其作为一个函数并尽可能多地调用它 你想要而不是到处重复相同的代码

function hideScript() {
    $('#carousel_ui_buttons_next-nav_next').remove();
});
// then use it like //
$(document).ready(function($) {
    hideScript();
});

上面的代码使用 JQuery,比 vanilla js 更容易理解和使用。

【讨论】:

  • 只有当 OP 想要删除整个块时才会出现这种情况。我相信他们可能会要求 &lt;script&gt; 标记内的 HTML 保持不变。我已向 OP 添加了评论以澄清。
  • 我只想删除
  • @CodyMan 所以你的意思是当你点击按钮时脚本标签应该被删除?
  • 不!我的意思是当网站加载时,脚本标签应该被删除,但里面的内容应该保留在那里。
  • @CodyMan 实际上将 btn 放在脚本标签中从一开始就是错误的,您应该尝试不同的方法。
【解决方案2】:

&lt;script&gt; 标记的内容是无效的 Javascript,但这是实现您所追求的一种可能的方法:

// Function to convert an HTML string to a DOM element
String.prototype.toDOM = function () {
    var d = document,
        i,
        a = d.createElement('div'),
        b = d.createDocumentFragment();
    a.innerHTML = this;
    while (i = a.firstChild) {
        b.appendChild(i);
    }
    return b;
};

// The <script> we wish to replace
var st = document.getElementById('carousel_ui_buttons_next-nav_next');

// Replace it with the <button> that is inside of it
st.parentNode.replaceChild(st.innerHTML.trim().toDOM(), st);

【讨论】:

  • 非常感谢您的出色回答。
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 2011-10-31
  • 2020-06-19
  • 2017-02-27
  • 2019-03-04
  • 2014-09-27
  • 2021-03-09
  • 2016-10-09
相关资源
最近更新 更多