русс | укр

Языки программирования

ПаскальСиАссемблерJavaMatlabPhpHtmlJavaScriptCSSC#DelphiТурбо Пролог

Компьютерные сетиСистемное программное обеспечениеИнформационные технологииПрограммирование

Все о программировании


Linux Unix Алгоритмические языки Аналоговые и гибридные вычислительные устройства Архитектура микроконтроллеров Введение в разработку распределенных информационных систем Введение в численные методы Дискретная математика Информационное обслуживание пользователей Информация и моделирование в управлении производством Компьютерная графика Математическое и компьютерное моделирование Моделирование Нейрокомпьютеры Проектирование программ диагностики компьютерных систем и сетей Проектирование системных программ Системы счисления Теория статистики Теория оптимизации Уроки AutoCAD 3D Уроки базы данных Access Уроки Orcad Цифровые автоматы Шпаргалки по компьютеру Шпаргалки по программированию Экспертные системы Элементы теории информации

Доступ к объекту по идентификатору в JavaScript

В этом случае может применяться одна из трех форм использования идентификатора:

  • document.all.item("идентификатор") или document.all("идентификатор");
  • document.getElementById("идентификатор");
  • идентификатор;

    где идентификатор - это идентификатор тэга, заданный с помощью параметра ID , например, txt в тэге <P ID="txt">.

    Для тех тэгов, для которых допускается использование параметра NAME, например, таких как <IMG>, <A>, а также элементов тэга <FORM>, в качестве идентификатора вместо параметра ID можно использовать параметр NAME.

    Третья форма доступа к тэгу по его идентификатору является наиболее простой, ее поддерживает браузер Microsoft Internet Explorer, но к ее недостаткам следует отнести то, что не все браузеры поддерживают эту форму доступа. Если необходимо добиться того, чтобы Web-страница была правильно обработана любым браузером, лучше воспользоваться второй, более универсальной формой.

    Необходимо обратить внимание на различие в двух вариантах обозначения имени тэга: в кавычках - "идентификатор" и без кавычек - идентификатор. Имя идентификатора тэга в кавычках имеет строковый тип и задает именно идентификатор тэга, тогда как имя идентификатора тэга без кавычек имеет тип объекта и задает указатель на тэг, как объект.

    Метод document.getElementById() возвращает указатель на тэг, и присвоив его значение переменной, например, h=document.getElementById(), можно дальше работать с переменной h так же, как с идентификатором, указанным в третьей форме.

    Обращение к тэгам по их индификаторам для изменения и восстановления свойств объектов показано в примере. Для этого используются функции changeTag(obj) и restoreTag(obj).
    Функция changeTag(obj) вызывается по нажатию или левой, или правой клавиш мышки, т.е. по событию Mousedown, после наведения указателя мышки на параграф с идентификатором "p1". Это происходит потому, что именно в этот тэг помещен обработчик события. По этой же причине параграф с идентификатором "p2" останется без изменения.
    При вызове функции в качестве ее параметра передается указатель на объект, заданный методом document.getElementById('p1') или просто getElementById('p1'):

    onMousedown="changeTag(getElementById('p1'))"

    При использовании браузера Microsoft Internet Explorer в качестве параметра функции changeTag() можно указать только имя идентификатора:

    onMousedown="changeTag(p1)"

    или переменную this, которая указывает на текущий объект:

    onMousedown="changeTag(this)"

    Функция changeTag(obj) выполняет следующие действия:

    • Меняет фон Web-страницы (действие, показывающее, что можно менять свойства не только того тэга, который указан, но и всех остальных);
    • Выполняет центрирование параграфа путем изменения значения HTML-параметра ALIGN;
    • С помощью параметра STYLE меняет значение свойства CSS font-style;
    • С помощью тэга <STYLE> меняет цвет и размер символов (значения свойств CSS color и font-size).

    Функция restoreTag(obj) вызывается по событию Contextmenu, т.е. по отжатию правой клавиши мышки при наведении указателя мышки на параграф с идентификатором "p1".
    Вызов этой функции отличается от описанного выше вызова функции changeTag(obj) тем, что для события Contextmenu уже существует заданный по умолчанию обработчик события, который после действий, предусмотренных обработчиком, заданным в тэге, будет выполнять действия по умолчанию: выводить на экран контекстное меню. Чтобы отменить эти действия непобходимо в обработчике после вызова функции restoreTag(obj) указать return false:

    onContextmenu="restoreTag(getElementById('p1')); return false"

    Функция restoreTag(obj) восстанавливает все исходные значения свойств тэга <P> путем задания всем этим свойствам пустых значений ("").

    Просмотреть пример


    <HTML>
    <HEAD>
    <TITLE>Изменение свойств объектов </TITLE>
    <STYLE>.big_red{color:red; font:1.5cm}</STYLE>
    <SCRIPT>
    function changeTag(obj)//Изменение свойств параграфа
    {
    bod.background="back.gif";
    obj.align="center";
    obj.style.fontStyle="italic";
    obj.className="big_red";
    }
    function restoreTag(obj)//Восстановление свойств
    {
    bod.background="";
    obj.align="";
    obj.style.fontStyle="";
    obj.className="";
    }
    </SCRIPT>
    </HEAD>
    <BODY ID="bod">
    <P ID="p1" ALIGN=left
    onMousedown="changeTag(getElementById('p1'))"
    onContextmenu="restoreTag(getElementById('p1'));
    return false"> Текст изменяется </P>
    <P ID="p2"> Текст без изменения </P>
    </BODY>
    </HTML>

  • Просмотров: 18688

    Вы можете --> Заказать скрипт

    Вернуться воглавление


    Карта сайта Карта сайта укр


    Уроки php mysql Программирование

    Онлайн система счисления Калькулятор онлайн обычный Инженерный калькулятор онлайн Замена русских букв на английские для вебмастеров Замена русских букв на английские

    Аппаратное и программное обеспечение Графика и компьютерная сфера Интегрированная геоинформационная система Интернет Компьютер Комплектующие компьютера Лекции Методы и средства измерений неэлектрических величин Обслуживание компьютерных и периферийных устройств Операционные системы Параллельное программирование Проектирование электронных средств Периферийные устройства Полезные ресурсы для программистов Программы для программистов Статьи для программистов Cтруктура и организация данных


     


    Полезен материал? Поделись:

    Не нашли то, что искали? Google вам в помощь!

     
     

    © life-prog.ru При использовании материалов прямая ссылка на сайт обязательна.