web-dev-qa-db-fra.com

Javascript: document.getElementById () renvoie NULL

Je suis assez nouveau avec Javascript et j'ai un problème avec document.getElementById () qui renvoie toujours la valeur NULL et qui me rend fou.

J'ai un élément dans mon code et je veux obtenir ses coordonnées pour pouvoir le déplacer.

Voici le code:

<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>

La fonction ci-dessus MoveIt () renvoie toujours NULL

javascripthtmlgetelementbyid
12
pasta

Vous n'avez jamais vérifié getElementById(...) pour NULL.

Vous avez coché getElementById(...).value pour NULL et les divs n'ont pas de "valeur".

Notez également que vous avez oublié de fermer cette balise <div />, ce qui est illégal dans votre XHTML ... et avez utilisé un doctype SVG pour une raison quelconque. SVG n'est pas HTML.

Ce que vous essayez de faire ici n’est pas vraiment clair.

8
Lightness Races in Orbit

Le contenu de la page doit être chargé avant d'essayer de les lire. Essayer 

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

Ou si vous utilisez jQuery, préférez

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

L'élément "arect" est un <div>, et les éléments <div> n'ont pas de "valeur".

Débarrassez-vous également de ce faux type de document SVG.

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

Ce code renvoie toujours null ou error. Si vous voulez voir si l'objet existe, procédez comme suit ....

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

De plus, div n'a pas value. Si vous voulez obtenir le code HTML dans div, utilisez xx.innerHTML

3
MNIK

Tout d'abord, ce que vous essayez de faire est lourd d'incohérences entre navigateurs Web qui imposeraient un pro du javascript, vous feriez donc mieux d'utiliser jQuery si vous débutez en javascript.

Deuxièmement, xx n'aura pas de valeur car il s'agit d'un DIV. Vous constaterez que xx n'est pas nul en soi.

0
James McCormack

dans mon cas, c'était à cause de cette ligne au début du fichier jsp/html (peu importe):

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

l'enlever a résolu mon problème.

0
Dogugun Ozkaya