使用document.getElementsByClassName("tips").onclick获得焦点后事件不执行？

Question

使用document.getElementsByClassName("tips").onclick获得焦点后事件不执行
HTML代码

<div class="box">    &nbsp;用  户  名  <input class="tips" type="text" name="userName" placeholder="您的账户名和登录名" form="form1">    <div class="tip">提示信息</div></div>

js代码

document.getElementsByClassName("tips").onclick=function(){    alert("djfh");    document.getElementsByClassName("tip").style.display="block";};

在练习一个注册页面，HTML代码下有很多个class相同的没贴上来。alert用来测试，发现alert都没有执行。是函数里的问题还是document获取元素有问题？

Answer 1

document.getElementsByClassName("tips")是所有classname为tips的元素集合，是为 NodeList 对象，要获取第一个dom应该是document.getElementsByClassName("tips")[0]

使用document.getElementsByClassName("tips").onclick获得焦点后事件不执行？

解决方案