getElementByid的结果是无效的吗？

StackOverflow https://stackoverflow.com/questions/4277026

  •  28-09-2019
  •  | 
  •  

题

仅仅用JavaScript类用作某些彗星代码的方法而苦苦挣扎，我该如何具有此代码的构造函数？以下代码无效：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">    
<html>    
    <head>    
        <link rel="Stylesheet" href="gStyle.css" />            
        <script type="text/javascript" language="javascript">    
            // Gantt chart object
            function ganttChart(gContainerID) {    
                this.isDebugMode = true;
                this.gContainer = document.getElementById(gContainerID);    
                if (this.isDebugMode) {
                    this.gContainer.innerHTML += "<div id=\"gDebug\">5,5 | 5.1</div>";
                }    
            }                
            var myChart = new ganttChart("chart1");                  
        </script>            
    </head>    
</html>    
<body>    
    <div id="chart1" class="gContainer"></div>    
</body>    
</html>

this.gcontainer为null

有帮助吗？

解决方案

那是因为您正在准备页面之前运行脚本，即 chart1 打电话时还不存在 new ganttChart("chart1");. 。包装内部代码 window.onload = function() { } 或在页面底部运行。

其他提示

问题是您的脚本运行得太早，它正在寻找DOM中不存在的元素 然而, ，要么运行您的脚本 onload, ，或将其放在 <body> 所以你 id="chart1" 运行时会发现元素。

问题是您在页面加载之前运行代码，因此在执行代码时不存在具有ID Chart1的DOM元素。

采用

window.onload = function(){myChart = new ganttChart("chart1");};

请注意，使用window.onload这样，将覆盖所有先前指定的窗口。沿着以下行会更好：

<script type="text/javascript">
var prevOnload = window.onload || function () {};
window.onload = function () {
prevOnload();
// do your stuff here
};
</script>

另外，直到拆卸图像被满载的Onload不会触发，请考虑使用jQuery＆$（Document）。Dready或类似。

:)

问候，佩德罗

许可以下： CC-BY-SA 和 归因
不隶属于 StackOverflow
scroll top