Question

我的代码中有多个 text / template 脚本，我希望能够使用javascript （Jquery）更改所有脚本中的 h1 标记

<script type="text/template">
    <h1>This should be replaced</h1>
    <p>Testing 123</p>
</script>

我不想从这个模板创建一个新元素，我想改变模板的实际内容。

这是我到目前为止所尝试的内容，遗憾的是它没有返回任何结果。

console.log($("script[type='text/template']"));

非常感谢指针！

Answer 1

由于h1元素不是DOM的一部分，您可以创建一个新元素，将HTML添加到该元素，操作它（使用jquery），然后将结果放回原始元素中script元素：

＆＃13;

t = $("script[type='text/template']")
container = $('<div/>').html(t.html())
container.find('h1').replaceWith('<h2>new content</h2>')
t.html(container.html())

console.log($("script[type='text/template']").html())

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script type="text/template">
    <h1>This should be replaced</h1>
    <p>Testing 123</p>
</script>

＆＃13;

Answer 2

你可以通过以下方式获得所有h1：

var x = document.getElementsByTagName("h1");

然后你循环它：

for (var i = 0; i < x.length; i++) {
    x[i].innerHTML = "text";
}

在文本/模板中编辑HTML

2 个答案: