老师,innerHTML未定义出错是什么原因?
我是照着老师的代码敲的,控制台显示innerHTML未定义是怎么回事?
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>检测兼容性解决方案</title>
<script src="解决getElementByClassName的兼容性代码.js"></script>
<script type="text/javascript">
var myUl2 =document.getElementById('myUl2');
var r =getElementsByClassName({
searchClass:"light dark",node:myUl2
});
console.log(r[0].innerHtml);
</script>
</head>
<body>
<ul id="myUl">
<li class="light">1</li>
<li class="light dark">2</li>
<li class="light">3</li>
</ul>
<ul id="myUl2">
<li class="light">1</li>
<li class="light dark">200</li>
<li class="light">3</li>
</ul>
</body>
</html>
var getElementsByClassName = function(opts){
var searchClass = opts.searchClass;//要查找的类名
var node = opts.node || document;//要查找的范围
var tag = opts.tag || '*';//一定范围要查找的标签
var result = [];
if (document.getElementsByClassName) {
var nodes = node.getElementsByClassName(searchClass);
if (tag !=="*") {
for (var i = 0; node=nodes[i++];) {
if (node.tagName===tag.toUpperCase()) {
result.push(node);
}
}
}else{
result = nodes;
}
return result;
}else{
var els =node.getElementsByClassName(tag);
var elsLen = els.length;
var i,j;
var pattern = new RegExp("(^|\\s)"+searchClass+"(\\s|$)");
for(i=0,j=0;i<elsLen;i++){
if (pattern.test(els[i].className)) {
result[j]=els[i];
j++;
}
}
return result;
}
}
正在回答
同学你好,代码还需要引入domReady.js(可见源码中的myReady.js):
由于代码是从上到下执行的,如果先使用js获取innerHTML的话,DOM可能还未加载,导致报错。所以添加myReady方法,让DOM加载完后再去执行js代码,这样就不会报错了。
如果我的回答帮了你,欢迎采纳,祝学习愉快~
恭喜解决一个难题,获得1积分~
来为老师/同学的回答评分吧
0 星