web-dev-qa-db-ja.com

Javascript：document.getElementById（）はNULLを返します

私はJavascriptを初めて使い、document.getElementById（）で常にNULLを返す問題が発生しました。

コードに要素があり、その座標を取得して移動できるようにします。

コードは次のとおりです。

<html>
  <head>
    <script type="text/javascript" >
      function MoveIt(obj) {
        alert(obj); // returns "Object HTMLDivElement"
        var xx = document.getElementById("arect");

        if(document.getElementById("arect").value == null) {
          alert('NULL >> ' + xx.value);
        }
        else {
          alert('NOT NULL >>' + xx.value);
        }

        posX = xx.style.scrollTop;
        posY = xx.style.left;
      }
    </script>
  </head>

  <body bgcolor="white" >
    <DIV class="background" id="MyDiv2">  
      <div id="arect" name="arect" class="transbox" onmousedown="MoveIt(this);" >
      </div>
    </div>
  </body>
</html>

上記の関数MoveIt（）は常にNULLを返します

javascripthtmlgetelementbyid
12
pasta

NULLのgetElementById(...)をチェックしたことはありません。

NULLのgetElementById(...).valueをチェックしましたが、divには「値」がありません。

また、XHTMLでは違法である<div />タグを閉じるのを忘れたことに注意してください。何らかの理由でSVG Doctypeを使用しました。 SVGはHTMLではありません。

ここで何をしようとしているのかは明確ではありません。

8
Lightness Races in Orbit

ページの内容は、読み込む前にロードする必要があります。試して

window.onload = function() {
  // run your script in here
}

または、jQueryを使用している場合は、

$(document).ready(function() {
  ...
}
27
Sailab Rahi

「正しい」要素は<div>、および<div>要素には「値」がありません。

その偽のSVG Doctypeも取り除きます。

8
Pointy
if(document.getElementById("arect").value == null){
    alert('NULL >> '+ xx.value);
  }

このコードは常にnullまたはエラーを返します。オブジェクトが存在するかどうかを確認するには、次の手順を実行します。

if(xx == null)
   alert('Object does not exist');
else 
   alert('Object exists. Inner HTML: ' + xx.innerHTML);

また、divにはvalueがありません。 div内でhtmlを取得する場合は、xx.innerHTMLを使用します

3
MNIK

まず、あなたがやろうとしていることは、javascriptのプロに負担をかけるブラウザ間の矛盾に満ちているため、javascriptを初めて使用する場合はjQueryを使用する方が良いでしょう。

次に、xxはDIVであるため値を持ちません。 xx自体はnullではないことがわかります。

0
James McCormack

私の場合、jsp/html（何でも）ファイルの先頭に次の行があるためです。

<meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1">

それを削除することで問題が解決しました。

0
Dogugun Ozkaya