Uncaught TypeError: op1[i].getElementsByName is not a function
为什么会报这个错误 为什么改成通过id获取就不会报错了？
而且我想要的效果是点击显示按钮时就把按钮对应的左侧的数字显示在下面的蓝色的方块里面 我这样写对吗？
<html>
<head>
<meta charset="utf-8">
<style>
#p2{width:50px;height:50px;background-color: blue;}
</style>
<script type="text/javascript">
window.onload=function(){
var op1=document.getElementsByName('p1');
var op2=document.getElementsByName('p2');
var oShow=document.getElementsByName('show');
var oAge=document.getElementsByName('age');
for(i=0;i<op1.length;i++){
oSh=op1[i].getElementsByName('show'); //这里报错
for(j=0;j<oSh.length;j++){
oSh[j].index=j;
oSh[j].onclick=function(){
age=oAge[this.index].innerHTML;
op2[i].innerHTML=age;
}
}
}
}
</script>
</head>
<body>
<p name="p1">
<span name="age">111</span><span name="show">显示</span><br />
<span name="age">222</span><span name="show">显示</span><br />
<span name="age">333</span><span name="show">显示</span>
<p name="p2" id="p2"></p>
</p>
<p name="p1">
<span name="age">444</span><span name="show">显示</span><br />
<span name="age">555</span><span name="show">显示</span><br />
<span name="age">666</span><span name="show">显示</span>
<p name="p2" id="p2"></p>
</p>
</body>
</html>
![[Web front-end] Node.js quick start](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
一、确定改成element.getElementById就不报错了吗？
element只有三个方法
Element.getElementsByTagName
Element.getElementsByClassName
Element.getElementsByTagNameNS
其他的那些都是document的方法。不一样的。
选取元素的时候尽量还是使用class和id。
二、程序运行上也是有问题的。
op2[i].innerHTML=age;这一块。运行的时候去外部查找i的值。外部运行完i已经是2了，所以op2[i]就会是undefined，建议传参或者使用闭包。可能修改的时候还会有连续的错误，先自己修改一下吧。
op1[i]是一个元素，并没有getElementsByName方法
用document啊你上面都是document，下面还不是一样