Question

我想创建一个外部js文件，我可以在其中配置我的html文件中的几个元素的副本。我正在使用 document.getElementById（“id”）。innerHTML =“what ever”; “注入”或“添加”我的副本到具有特定id的html元素。

这很好，但是当我的html文件中有多个具有相同id的元素时，我的js文件中的html只被添加到第一个元素但是来自我的js文件的html应添加到具有相同ID的所有元素

这是我的html构造：

<html>
<head>
<script src="copy.js" type="text/javascript" charset="utf-8"></script>
<script src="jquery.js" type="text/javascript" charset="utf-8"></script>
</head>

<body>

<div>
<strong id="back-button"></strong>
</div>

....

<div>
<strong id="back-button"></strong>
</div>

</body>
</html>

那是我的JS文件：

$(function() {
    $(document).ready(function addcopy() {

        /* global */
        document.getElementById("back-button").innerHTML = "go back";
});
});

非常感谢任何帮助或提示。谢谢！

Answer 1

您可以使用class，因为id只能使用一次。

<html>
<head>
<script src="copy.js" type="text/javascript" charset="utf-8"></script>
<script src="jquery.js" type="text/javascript" charset="utf-8"></script>
</head>
<body>
<div class="back-button">
</div>
....
<div class="back-button">
</div>
</body>
</html>

在javascript中：

<script type="text/javascript">
     $(document).ready(function addcopy() {
         /* global */
         $(".back-button").html("<strong>go back</strong>");
     });
</script>

Answer 2

在js中你可以这样做：

 document.getElementsByClassName('message')[0].innerHTML = "Good afternoon:)!";

然后你可以循环遍历这个类的所有元素。

Answer 3

id属性应该是唯一的，我知道在JQuery中如果你想使用多个选择器，你可以使用class代替。

或者您可以使用name和getElementsByName()函数在Javascript中为您提供一系列元素。

Answer 4

你有jQuery，为什么不使用$('#back-button').html('go back')而不是普通/本地JS？

但是，您有多个按钮且 ID 必须是唯一的，因此您无法使用此ID。使用class="back-button"和以下jQuery代码：

$('.back-button').html('go back');

Answer 5

请为HTML元素使用class而不是id，并使用jquery填写所需的文本。

<div>
<strong class="back-button"></strong>
</div>


$('.back-button').text('go back');   // OR
$('.back-button').html('go back');

document.getElementById.innerHTML只能工作一次 - 如何配置全局复制元素？

5 个答案: