Question

jQuery命令和getElementById似乎都无法获取我的DOM项目。

我脚本的一部分如下所示：

var box_size = $("#testbox").height();      
var c = document.getElementById("s1"); 
console.log(c);  // returns null
console.log(box_size); // returns null
console.log($(window).height()); // returns the correct number

c.width = box_size + $(window).height(); // cannot set width of null

我的DOM树的摘录基本上看起来像这样

<div class="wrap" id="mainwrap">
  <div class="row relef">
    <div class="box relef" id="testbox"><canvas id="s1"></canvas></div>
    <div class="box relef"><canvas id="s2"></canvas></div>
    <div class="box relef"><canvas id="s3"></canvas></div>
  </div>
</div>

我包装了我的主要JS代码：

$(function() {
// my entire js code is wrapped in this
});

我认为DOM树应该在我执行JS时加载。使用.hide（）隐藏元素，但我从未从DOM树或类似地删除它们。这些盒子有一个设定的宽度和高度，我可以用图形方式看到，因为我将它们的背景设置为红色。尺寸约为80 x 80像素。我通过W3CSchools检查了我的HTML代码，没有错误。

你知道错误是怎么发生的吗？

TypeError: null is not an object (evaluating 'c.width = box_size + $(window).height() * 0.04')

编辑：

console.log(document.readyState); // returns "complete"

我在声明box_size

之前直接使用它

jQuery和getElementById无法访问加载的DOM元素（div）

0 个答案: