Что quertySelector возвращает нулевое значение?

1

querySelector возвращает null при поиске идентификатора "#b> a", но getElementById возвращает правильный элемент. Что происходит?

var x = document.querySelector('#b>a');
console.log(x);
var y = document.getElementById("b>a");
console.log(y);
Name <input type="text" id="b>a">
  • 0
    Зачем вам нужно такое имя идентификатора, потому что, по прогнозам, оно может быть проблемным?
Теги:
dom
css-selectors

3 ответа

5
Лучший ответ

Символ > имеет смысл в синтаксисе селектора CSS. Вам нужно будет использовать "#b\>a".

The > является комбинатором "непосредственного ребенка", поэтому обычный "#b>a" выбирает элемент <a> который является дочерним элементом вашего элемента с идентификатором "b".

Поделиться
  • 1
    ... в этот момент вы также можете просто использовать document.getElementById (), если в вашем случае не требуется селектор.
  • 0
    Это называется комбинатор;)
Показать ещё 5 комментариев
2

Вам нужно избежать символа >. См. Фрагмент ниже

var x = document.querySelector('#b\\>a');
console.log(x);
var y = document.getElementById("b>a");
console.log(y);
Name <input type="text" id="b>a">
Поделиться
1

Запрос по селектору будет искать типы перед символами, поэтому он будет искать вместо текста a.

Чтобы заставить это работать, вам нужно будет избежать выбора, используя

var x = document.querySelector('#b\\>a');
Поделиться

Ещё вопросы

Сообщество Overcoder
Наверх
Меню