Question

在你投票之前，我已经阅读了很多问题而且对我没有帮助。即使输入类型中存在值，我的Javascript alert也会返回null。

这是代码： -

<script>
if (document.getElementById('p0002') != null) {
    var str = document.getElementById("p0002").value;
}
else {
    var str = null;
}
alert(str);
</script>

 <input type="hidden" name="p0002" id="p0002" value="1" >
 <input type="hidden" name="p0003" id="p0003" value="0" >
 <input type="hidden" name="p0004" id="p0004" value="2" >

它始终返回null。控制台中的错误说：

未捕获的TypeError：无法读取null
的属性“value”

自上次1小时后尝试修复它。这有什么不对？

Answer 1

将JavaScript换入window.onload。目前，您的JavaScript正在元素存在之前执行：

<script>
window.onload = function () {
    if (document.getElementById('p0002') != null) {
        var str = document.getElementById("p0002").value;
    }
    else {
        var str = null;
    }
    alert(str);
}
</script>

您可以做的另一件事是将脚本标记移动到您引用的元素之后：

<input type="hidden" name="p0002" id="p0002" value="1" >
<input type="hidden" name="p0003" id="p0003" value="0" >
<input type="hidden" name="p0004" id="p0004" value="2" >
<script>
if (document.getElementById('p0002') != null) {
    var str = document.getElementById("p0002").value;
}
else {
    var str = null;
}
alert(str);
</script>

Answer 2

在将输入添加到DOM后，应该执行您的脚本。使您的脚本工作的最常用的浏览器方法是在关闭<body>标记之前移动它，并将其包装成立即函数：

<script>
(function() {
   if (document.getElementById('p0002') != null) {
       var str = document.getElementById("p0002").value;
   } else {
       var str = null;
   }
       alert(str);
 })();
</script>
</body>

这比onload处理程序执行起来更快，因为它只等待DOM准备就绪，而不是所有图像都要加载。而且，这适用于每个浏览器。

Answer 3

这里你的脚本应该在html之后。

未捕获的TypeError：无法读取null的属性“value”，Element确实存在

3 个答案: