使用getElementById填充数组无返回结果,求问题原因
根据你描述的场景,执行console.log(graphData)后无任何返回,大概率是以下几个常见原因之一,咱们一个个拆解清楚:
1. JS代码跑在DOM元素加载之前(最常见的坑)
如果你的JavaScript代码直接放在<head>标签里,或者写在HTML结构的最顶部,浏览器会优先执行这段JS——但这时候那些id为E1_INV_Funds0到E1_INV_Funds7的div元素还没被渲染到DOM树里!getElementById找不到元素,会返回null,后续转整数的操作自然也没法正常填充数组。更糟的是,如果你的fillData函数是在DOM没准备好的时候调用的,整个填充逻辑等于白跑,最后graphData要么是空数组,要么全是NaN,甚至可能因为找不到元素导致代码静默失败。
解决思路:把JS代码挪到<body>标签的最末尾,或者用DOMContentLoaded事件包裹函数调用,确保DOM就绪后再执行:
document.addEventListener('DOMContentLoaded', function() { fillData(); console.log(graphData); });
2. fillData函数压根没被调用
你说定义了fillData函数,但如果代码里没有主动写fillData()来触发它,那graphData只会保持初始状态(比如空数组)。要是你在函数外部直接console.log(graphData),自然看不到填充后的内容。
检查点:确认代码里有明确的fillData()调用语句,而且调用时机在DOM就绪之后。
3. 获取div内容的方式错了
div元素不像input那样有value属性!如果你用了document.getElementById(id).value来获取内容,得到的会是undefined,转整数后是NaN。正确的做法是用textContent或者innerText来读取div里的数字:
let element = document.getElementById(`E1_INV_Funds${i}`); let num = parseInt(element.textContent, 10); graphData.push(num);
不过这个情况一般会让数组里充满NaN,而不是完全无返回,但也是值得排查的点。
4. 变量作用域出问题了
如果graphData是定义在fillData函数内部的局部变量,那你在函数外部执行console.log(graphData)时,会因为变量未定义而报错(控制台应该能看到红色错误提示)。要是你没注意到报错,就会觉得“无任何返回”。
检查点:确认graphData是全局变量,或者在你执行console.log的作用域里能访问到它。
内容的提问来源于stack exchange,提问作者Fr1nk

