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


javascript html getelementbyid
person pasta    schedule 24.05.2011    source источник
comment
Пожалуйста, подумайте об очистке вашего фрагмента кода и удалите CSS, так как он не добавляет ничего, кроме беспорядка, к вашей проблеме. Вы уверены, что элемент с идентификатором arect существует, и вызываете ли вы этот код после загрузки dom. Предоставьте HTML, соответствующий JS.   -  person scrappedcola    schedule 24.05.2011
comment
<?xml version="1.0" standalone="no"?> <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"> - ??? Предполагается, что это HTML-страница, верно?   -  person thirtydot    schedule 24.05.2011
comment
@thirtydot: здесь может быть проблема.   -  person Rocket Hazmat    schedule 24.05.2011
comment
учитывая, что вы передаете this в функцию, и она должна равняться объекту, который вы пытаетесь получить, зачем вам вообще нужен getElementById()? Вы должны иметь возможность просто использовать obj.   -  person Spudley    schedule 24.05.2011
comment
Вы передаете свой объект своей функции, но не используете его :( ... obj = document.getElementById('arect').   -  person Kraz    schedule 24.05.2011
comment
Я только что передал свой объект для целей отладки   -  person pasta    schedule 24.05.2011

Ответы (7)


arrow_upward
8
arrow_downward

Вы никогда не проверяли getElementById(...) на NULL.

Вы проверили getElementById(...).value для NULL, а div не имеют «значения».

Также обратите внимание, что вы забыли закрыть этот тег <div />, который является незаконным в вашем XHTML... и по какой-то причине использовали тип документа SVG. SVG — это не HTML.

Не совсем понятно, что вы пытаетесь здесь сделать.

person Lightness Races in Orbit    schedule 24.05.2011
comment
Спасибо, я забыл удалить тип документа SVG. значение удалено сейчас, но это все еще не работает - person pasta; 24.05.2011
comment
@pasta: Что не работает? Что ты пытаешься сделать? Вы используете document.getElementById правильно, так что что-то еще не так. - person Lightness Races in Orbit; 24.05.2011
comment
Это моя точка зрения. То, как я написал, по-видимому, правильно, но все еще имеет pb, т.е. document.getElementById(arect) всегда равно null - person pasta; 24.05.2011

arrow_upward
28
arrow_downward

Содержимое страницы должно быть загружено, прежде чем пытаться его прочитать. Пытаться

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

Или, если вы используете jQuery, предпочитайте

$(document).ready(function() {
  ...
}
person Sailab Rahi    schedule 17.12.2012

arrow_upward
8
arrow_downward

Элемент "arect" представляет собой <div>, а элементы <div> не имеют "значения".

Избавьтесь и от этого фиктивного типа документа SVG.

person Pointy    schedule 24.05.2011
comment
Спасибо, я забыл удалить тип документа SVG. значение удалено сейчас, но это все еще не работает - person pasta; 24.05.2011
comment
@pasta да, на самом деле это работает - убедитесь, что вы избавились от всех ссылок на .value из <div>, включая xx.value и т. д. - person Pointy; 24.05.2011
comment
Большое спасибо, теперь все работает, я немного почистил код, и все заработало ;) Кроме того, вы знаете, как получить координаты ‹div› ? Я пробовал с obj.style.left, но это ничего не возвращает... - person pasta; 24.05.2011
comment
Получить координаты @pasta в целом может быть сложно - вероятно, следует написать для этого отдельный вопрос :-) - person Pointy; 24.05.2011

arrow_upward
3
arrow_downward 

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. Если вы хотите получить html внутри div, используйте xx.innerHTML

person MNIK    schedule 24.05.2011
comment
@pasta: Какой она должна быть? Я не вижу никакого содержимого внутри этого div. - person Lightness Races in Orbit; 24.05.2011

arrow_upward
0
arrow_downward

Во-первых, то, что вы пытаетесь сделать, чревато несогласованностью между браузерами, что облагает налогом профессионала javascript, поэтому вам будет лучше использовать jQuery, если вы новичок в javascript.

Во-вторых, xx не будет иметь значения, так как это DIV. Вы обнаружите, что xx сам по себе не равен нулю.

person James McCormack    schedule 24.05.2011

arrow_upward
0
arrow_downward

в моем случае это было из-за наличия этой строки в начале файла jsp/html (независимо от):

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

удаление решило мою проблему.

person Dogugun Ozkaya    schedule 07.03.2014

arrow_upward
-1
arrow_downward

если для кнопки установлено значениеvissble=false, вы не можете получить идентификатор этой кнопки на стороне клиента. Чтобы скрыть кнопку, используйте

button1.Style.Add("display","none")-- for visible false

а также

button1.Style.Add("display","block")-- for visible true

и даже если кнопка включена, false мы не можем получить идентификатор кнопки на стороне клиента

Вы можете получить идентификатор кнопки с помощью document.getElementById('‹%= button1.ClientID %>'); Или, если вы установите ClientIDMode="Static" для элемента управления на странице aspx, вы можете получить его непосредственно с помощью document.getElementById('button1'); Или document.getElementById('MainContent_button1'); --- MainContent здесь является идентификатором заполнителя содержимого, если у вас есть идентификатор заполнителя содержимого, отличный от id_button1.

person Vijender Reddy    schedule 16.10.2012
comment
Не подписывайте свои посты. Прочтите часто задаваемые вопросы по этому вопросу. - person betomontejo; 17.10.2012
comment
В вопросе об ASP.NET нет упоминания, но, похоже, именно отсюда вы подходите к этому. - person Sir Crispalot; 17.10.2012