GetElementByidの結果はnullですか？

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

  •  28-09-2019
  •  | 
  •  

質問

JavaScriptクラスがいくつかのComeTishianコードの方法として使用されていることに苦労しているだけで、このコードのコンストラクターはどうすればよいですか？次のコードが無効です。

<!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を使用すると、以前に記載されていたすべてのwindow.onload宣言をオーバーライドすることに注意してください。次の行に沿った何かの方が良いでしょう：

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

また、Al画像が完全にロードされている場合、オンロードはトリガーされません。JQuery＆$（document）.Readyまたは同様の使用を検討してください。

:)

よろしく、ペドロ

ライセンス： CC-BY-SA と 帰属
所属していません StackOverflow
scroll top