Доступ к содержимому объекта в Javascript

Question

Я довольно новичок в Javascript. У меня только основной вопрос. Может кто-нибудь сказать мне, почему выполнение javascript-кода в ссылке JSFiddle ниже приводит к этой ошибке: «Невозможно прочитать свойство« innerHTML »из null».

Ссылка: http://jsfiddle.net/ali89ma/tz5h8umk

var myTable = document.createElement("TABLE"); 
var row1 = myTable.insertRow(-1); 
var cell1 = row1.insertCell(-1); 
cell1.innerHTML = "23.00"; 
cell1.id = "1000price"; 
var cell1Content = document.getElementById("1000price").innerHTML; 
console.log(cell1Content); 

Но если я пишу строку ниже она отлично работает.

var cell1Content = cell1.innerHTML; 
console.log(cell1Content); 

Спасибо.

Answer 1

как упоминалось выше Метод getElementById() возвращает элемент, который имеет атрибут ID из DOM с указанное значение.

создается элемент таблицы dynamiclly, но, которого не добавить его на свою страницу (это добавит таблицу элементов DOM)

поэтому вам нужно добавить этот заказ на добавление в ваш код так:

// create a table element dynamiccly but it still not in the DOM elements 
    var myTable = document.createElement("TABLE"); 
    var row1 = myTable.insertRow(-1); 
    var cell1 = row1.insertCell(-1); 
    cell1.innerHTML = "23.00"; 
    cell1.id = "1000price"; 
//the next line will add your table to the DOM 
    document.body.appendChild(myTable); 
//now you can use the getElementById method to get elements from the DOM 
    var cell1Content = document.getElementById("1000price").innerHTML; 
    console.log(cell1Content); 

Answer 2

insertCell возвращает null, если родительский table не существует в DOM.

Добавьте эту строку сразу после строки 1:

var myTable = document.createElement("TABLE"); 
document.body.appendChild(myTable); // <-- this line 
var row1 = myTable.insertRow(-1); 

После добавления строки она работает, и я получаю «23,00» выход в моей консоли.

Answer 3

Вы должны добавить элемент после создания

var myTable = document.createElement("TABLE"); 
document.body.appendChild(myTable); 

Answer 4

Вы создаете таблицу с помощью JavaScript. Когда вы пытаетесь получить доступ к элементу таблицы, он не будет присутствовать в DOM. Вам нужно добавить таблицу в DOM, тогда она будет работать. Добавьте эту линию, способную var cell1Content

document.body.append (myTable);

Answer 5

Append таблица в body перед доступом к элементу

var myTable = document.createElement("TABLE"); 
document.body.appendChild(myTable); 

работы скрипка
http://jsfiddle.net/tz5h8umk/2/