Javascript: установка / получение элементов по их идентификатору

Question

Я давно не имел дела с javascript, поэтому, пожалуйста, потерпите меня, если мой вопрос кажется глупым.

Я пытаюсь создать изображение, установить его идентификатор, а затем попытаться получить'элемент, я всегда придумываю' null '

  var gearImg = new Image();
  gearImg.id = "logoGear";
  gearImg.src = "img/gear-fun.png";

  var gear = document.getElementById("logoGear");
  // null?
  alert(gear);

Если у меня есть фактическое изображение в моем HTML с установленным идентификатором, тогда' getElementByID 'работает как ожидалось.Я уверен, что мне здесь не хватает чего-то простого или тривиального, но я не знаю ничего лучшего.Что происходит, и как мне получить поведение, которое я хочу.

Answer 1

document.getElementById имеет дело только с элементами в вашем документе.Поскольку gearImg не является частью документа, он ничего не возвращает.Попробуйте сначала поместить его куда-нибудь, например:

 document.body.appendChild(gearImg)

(Мои навыки работы с DOM тоже ржавые, я не уверен, что это работает так. Почему бы нам просто не использовать jQuery?)

Answer 2

Вы должны добавить элемент к цели, например, body, первый или другой элемент DOM

var gearImg = new Image();
gearImg.id = "logoGear";
gearImg.src = "img/gear-fun.png";

document.body.appendChild(gearImg); // add to body tag

var gear = document.getElementById("logoGear");
alert(gear);

Answer 3

Это потому, что вы не добавили изображение в документ.

Поэтому, когда вы делаете document.getElement...., вы должны получить ничего

---

скрипка того, что вы должны делать: http://jsfiddle.net/maniator/UPaUa/

Код:

var gearImg = new Image();
gearImg.id = "logoGear";
gearImg.src = "img/gear-fun.png";
document.body.appendChild(gearImg);
var gear = document.getElementById("logoGear");

alert(gear);​

Answer 4

Чтобы получить element из DOM, вам необходимо append сначала DOM.

Использование:

document.body.appendChild(gearImg);

Или:

someElement.appendChild(gearImg);

Тогда вы можете позвонить document.getElementById('logoGear');

Answer 5

Это потому, что document.getElementById предназначен для доступа к элементам в DOM, но объект, который вы создали в своем скрипте, находится только в памяти, а не в документе.

На самом деле, потому что этопамяти, вам все равно не нужно обращаться к нему таким образом - у вас уже есть это в переменной.

Чего вы на самом деле пытаетесь достичь?Если вам просто нужно добавить изображение в существующий элемент на странице, вам нужно сначала найти этот существующий элемент и добавить к нему.

Мне кажется, я должен также указать, что вы можете найти jQuery самым простым подходом,Это действительно позволяет легко поиграться с содержанием страницы.

Answer 6

Потому что вы не добавили зацепление в ваш документ .. этот document.getElementById ("") работает только с элементами документа ... такими как таблицы, строки, которые уже существуют на странице документа.

Answer 7

Элемент еще не добавлен в DOM и поэтому не находится внутри document.

Вы можете получить доступ к только что созданному вами изображению с помощью дескриптора, который вы использовали при его создании - gearImg.

Также не относится к вашему вопросу, но вам, безусловно, следует использовать фреймворк javascript, например, JQuery.