В лабораторной работе 9 "Изменение свойств объектов на Web-странице" был рассмотрен способ доступа к объектам на Web-странице с помощью их идентификаторов. Этот метод прост, но требует для каждого объекта, свойства которого необходимо изменить, задания его идентификатора. При большом числе объектов на Web-странице это может вызвать затруднения.
Другим, более универсальным, способом доступа к объектам, является доступ к отмеченным объектам. Для того, чтобы отметить тэг, свойства которого необходимо определить или изменить, достаточно подвести к нему указатель мыши и выполнить одно из событий, совершаемых с помощью мыши, - Mouseover, Mousemove, Mouseout, Click, Dblclick или Contextmenu (описание событий смотрите в лабораторной работе 9). При таком подходе не требуется, чтобы объекты имели идентификаторы.
Доступ к отмеченным элементам и его свойствам осуществляется с помощью такой конструкции:
window.event.srcElement.свойство ,
где window.event.srcElement - отмеченный объект; свойство - одно из его свойств.
Одним из важных свойств объекта является свойство parentElement, которое указывает на родительский объект. Например, для тэга <BODY> родительским тэгом будет <HTML>. Тогда к свойствам родительского тэга можно обратиться следующим образом: window.event.srcElement.parentElement.свойство. Используя данную конструкцию можно обратиться к свойствам родителя данного родителя, т.е. деда и т.д.
Изменение свойств отмеченного объекта производится так же, как показано в лабораторной работе 9, только вместо указания идентификатора объекта используется приведенная выше конструкция. Например, для изменения цвета отмеченного объекта можно воспользоваться следующим оператором JavaScript: window.event.srcElement.style.color="red".
Если отмеченный объект необходимо использовать не сразу, то можно при его отметке с помощью свойства sourceIndex запомнить его номер (согласно объектной модели документа каждый объект имеет свой номер, например, номер объекта <HTML> равен 0). Тогда номер объекта, отмеченного, например, щелчком мыши можно определить так: onClick="num=window.event.srcElement.sourceIndex".
В дальнейшем доступ к отмеченному объекту с номером num можно осуществить следующим образом:
document.all(num).свойство.