Почему н работает переменная в document.getElementById(x)?

Question

[Aspirant555]

В общем, если ввести имя напрямую, то всё отлично, а если через переменную то:

//      var c = document.getElementById('gobl3').getBoundingClientRect();
var x[2] = "gobl3";
console.log(x[2]);
              var d = document.getElementById(x[2]).getBoundingClientRect();

скрипты:1 Uncaught TypeError: Cannot read properties of null (reading 'getBoundingClientRect')

Comments

[Lynn «Кофеман»]

var x[2]? И это вообще запускается?

[Aspirant555]

Lynn «Кофеман», ну это для кратности, на самом деле был разделен текст на массив split('split');

Answer 1

[dollar]

Как и написано, JS пытается получить свойство getBoundingClientRect у переменной, в которой содержится null.

Следовательно, document.getElementById('gobl3') === null

Следовательно, элемента с id "glob3" не существует, он не найден.
(Конкретный id зависит от номера строки, в которой произошла ошибка).

Comments

[Aspirant555]

с gobl3 всё отлично, проблема, в x[2], в которой вписан "gobl3"

[dollar]

aspirantes, если так, то уточни нюансы данного случая с помощью той же console.log, которой ты хорошо умеешь пользоваться.
Примеры:

console.log(typeof x[2]);
console.log(x[2] === 'glob3');
console.log(x[2].length);
//и т.д.

Или даже так, что можно оставить в коде навсегда:

var glob3 = document.getElementById(x[2]);
if (!glob3) {
  console.log("Ошибка! Нет элемента с id =", x[2]);
  console.log("num =", 2); //Если внутри цикла, то соответственно i
  retrun; //выход из функции, чтобы не захламлять лог консоли
}
var d = glob3.getBoundingClientRect();

[Aspirant555]

dollar, не пойму,

console.log(x[2]); // 'gobl3'
console.log(typeof 'gobl3' ); // string
console.log(x[2] == 'gobl3'); //'false' 
console.log(typeof x[2]);  //'string'

[dollar]

aspirantes, а ты смотри внимательней.
Вот я допустил опечатку. Вместо "glob3" написал "gobl3", а ты не заметил.
Скорее всего, ты тоже где-то в коде опечатался и упорно не замечаешь при прочтении.
Постарайся увеличить внимательность и подозрительность хотя бы вот в такие моменты, когда ничего не понятно, типа парадокс.

[Aspirant555]

dollar, а вот длина действительно отличается, 5 / 18

[dollar]

aspirantes, вот и нашли косяк! Дальше, надеюсь, справишься, можешь хоть посимвольно сравнить строки. Удачи :)