innerHTML的javascript getElementsByName错误

我正在使用DOM获取多个类名，并传递一个函数（带有_值）来访问单个元素。但是，我得到一个未捕获的TypeError，无法读取未定义的属性“innerHTML”。 代码是：

<script>
    var token = 1;
                 var x = document.getElementsByName("commpare_name");

                var y = document.getElementsByName("compare_image");

     function add_compare(num)
            {  num=0;



                    var a = x[num].innerHTML.toUpperCase();
                        alert(a);
                    document.getElementById('name1').innerHTML = a;
                    document.getElementById('name1').title = a
                    document.getElementById('pics1').src = x[num].src;
                    a = document.getElementById('view-details0').action;


            }
</script>

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

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

var-token=1；
var x=document.getElementsByName（“commpare_name”）；
var y=document.getElementsByName（“比较图像”）；
函数添加\比较（num）
{num=0；
var a=x[num].innerHTML.toUpperCase（）；
警报（a）；
document.getElementById（'name1'）。innerHTML=a；
document.getElementById（'name1'）。title=a
document.getElementById（'pics1'）.src=x[num].src；
a=document.getElementById（'view-details0'）。操作；
}
一号
一号

编辑：

<a class="description" id="name1" href="" target="_blank" title="ADD TO COMPARE" ><span>ADD TO COMPARE</span></a>

---

此文件的innerHTML和e href需要更改

您在脚本中给出了错误的名称

commpare_name - > compare_name

---

您在脚本中给出了错误的名称

commpare_name - > compare_name

---

实际问题是在加载DOM内容之前执行JavaScript。把你的JS包起来

window.addEventListener('DOMContentLoaded',function(){
  …
});

或者将您的

放在

的底部

当你执行

var x = document.getElementsByName("commpare_name");

您会得到一个空的

NodeList

，因为还不存在具有这样名称的元素。当您尝试访问

x[num]

即

x[0]

时，该属性

0

不存在，因此会导致

未定义

var a = x[num].innerHTML.toUpperCase();

之后，将从
未定义的
中读取.innerHTML
，这是不可能的


更新：我没有意识到
名称
是拼写错误，而且是作者指出的。你显然必须改变这一点。如果您的
实际上位于该HTML之上，那么您仍然必须更改脚本位置或如上所述对其进行包装。
实际的问题是在加载DOM内容之前执行JavaScript。把你的JS包起来

window.addEventListener('DOMContentLoaded',function(){
  …
});

var x = document.getElementsByName("commpare_name");

或者将您的
放在
的底部

当你执行

var x = document.getElementsByName("commpare_name");

您会得到一个空的
NodeList
，因为还不存在具有这样名称的元素。当您尝试访问
x[num]
即
x[0]
时，该属性
0
不存在，因此会导致
未定义

var a = x[num].innerHTML.toUpperCase();

之后，将从
未定义的
中读取.innerHTML
，这是不可能的


更新：我没有意识到
名称
是拼写错误，而且是作者指出的。你显然必须改变这一点。如果您的
实际上位于该HTML之上，那么您仍然需要更改脚本位置或如上所述对其进行包装

var x = document.getElementsByName("commpare_name");

应该是

var x = document.getElementsByName("compare_name");  //Typo in **compare_name**

应该是

var x = document.getElementsByName("compare_name");  //Typo in **compare_name**