JavaScript 如何发送不同的实体但保持相同的 ID？

Question

假设我有 2 个由 div 容器分隔的区域，当在该容器中调用函数时，我需要在本地发送来自不同区域的 Id 值。

摘录:

   <script> 
       document.getElementById('compare_name").innerHTML = "Changed";
</script>

<div class = "details>

    <span id="compare_name">no1</span> 
    <form id="view-details0">
    <input type="button" value="Add to Compare" onclick="add_compare()">
    </form>
</div>

<div class  = "details">

<span id="compare_name">no2</span> 
    <form id="view-details0">
    <input type="button" value="Add to Compare" onclick="add_compare()">
    </form>
</div>

Answer 1

您不能为多个元素使用相同的 ID。您可以像下面这样使用名称:

<script> 
       var x = document.getElementsByName("compare_name");
for(var i = 0; i < x.length ; i++){
x[i].innerHTML = "Changed";
                        }
</script>

<div class = "details>

    <span id="compare_name" name="compare_name">no1</span> 
    <form id="view-details0">
    <input type="button" value="Add to Compare" onclick="add_compare()">
    </form>
</div>

<div class  = "details">

<span id="compare_name" name="compare_name">no2</span> 
    <form id="view-details0">
    <input type="button" value="Add to Compare" onclick="add_compare()">
    </form>
</div>