Книга: JavaScript. Подробное руководство, 6-е издание

15.2.1. Выбор элементов по значению атрибута id

15.2.1. Выбор элементов по значению атрибута id

Все HTML-элементы имеют атрибуты id. Значение этого атрибута должно быть уникальным в пределах документа - никакие два элемента в одном и том же документе не должны иметь одинаковые значения атрибута id. Выбрать элемент по уникальному значению атрибута id можно с помощью метода getElementById() объекта Document. Этот метод уже использовался в примерах глав 13 и 14:

var section1 = document.getElementById("section1");

Это самый простой и самый распространенный способ выборки элементов. Если сценарию необходимо иметь возможность манипулировать каким-то определенным множеством элементов документа, присвойте значения атрибутам id этих элементов и используйте возможность их поиска по этим значениям. Если потребуется отыскать более одного элемента по значению атрибута id, можно воспользоваться удобной функцией getElements(), реализация которой приводится в примере 15.1.

Пример 15.1. Поиск нескольких элементов по значениям атрибута id

/**
* Эта функция принимает произвольное количество строковых аргументов.
* Каждый аргумент интерпретируется как значение атрибута id элемента,
* и для каждого из них вызывается метод document.getElementById().
* Возвращает объект, который отображает значения атрибута id
* в соответствующие объекты Element. Если какое-то значение атрибута id
* не будет найдено в документе, возбуждает исключение Error.
*/
function getElements(/* значения атрибутов id...*/) {
  var elements = {}; // Создать пустое отображение
  for(var і = 0; і < arguments.length; i++) { // Для каждого аргумента
    var id = arguments[i]; // Аргумент - id элемента
    var elt = document.getElementById(id); // Отыскать элемент
    if (elt == null) // Если не найден,
      throw new Error("No element with id:" + id); // возбудить ошибку
    elements[id] = elt; // Отобразить id в элемент
  }
  return elements; // Вернуть отображение id в элементы
}

В версиях Internet Explorer ниже IE8 метод getElementById() выполняет поиск значений атрибутов id без учета регистра символов и, кроме того, возвращает элементы, в которых будет найдено совпадение со значением атрибута name.

Оглавление книги