«Единственный способ творить великие дела – это любить то, что ты делаешь»
JavaScript



Игра «Морской Бой» на JavaScript: Простая Игра и Игра для Двоих



Метод getAttribute в JavaScript возвращает значение атрибута элемента страницы или null.

Если атрибут не существует, то метод getAttribute вернет null.

var any = document.getElementById("...");
var element = any.getAttribute("attribute");

При помощи метода getElementById выбираем элемент страницы. Результат заносим в произвольную переменную any, через которую работаем с выбранным элементом как с объектом.

МетодgetElementById содержит 1 аргумент: имя атрибута attribute, значение которого требуется получить.

Результат заносится в произвольную переменную element.



Метод getAttribute - Возвращает значения атрибута

Продолжим работать с примером из предыдущей заметки и теперь при помощи метода getAttribute получим значение атрибута title одного из параграфов.

Фрагмент кода

<body>

<h1>Our Planet</h1>

<p id="earth" title="Our Planet is beautiful...!!!">Green Planet</p>

<h1>Red Planet</h1>

<p id="mars">Mars is red planet</p>

 

<script type="text/javascript">

var planet = document.getElementById("earth");

var title_Element = planet.getAttribute("title");

document.write("<p> We get the title of the element with id «earth»: «" + title_Element + "»");

</script>

</body>

Результат

Метод getAttribute - Возвращает значения атрибута

Our Planet

Green Planet

Red Planet

Mars is red planet

We get the title of the element with id «earth»: «Our Planet is beautiful...!!!»

Комментарии к примеру.

  • При помощи метода getElementById получаем доступ к параграфу с id="earth".

  • При помощи метода getAttribute возвращаем значение атрибута title выбранного элемента.

  • Результат заносим в переменную title_Element, которую затем выводим на экран.

Метод getAttribute возвращает null

Продолжим работать с предыдущим примером и теперь при помощи метода getAttribute пробуем вернуть значение атрибута title другого параграфа.

Фрагмент кода

<body>

<h1>Our Planet</h1>

<p id="earth" title="Our Planet is beautiful...!!!">Green Planet</p>

<h1>Red Planet</h1>

<p id="mars">Mars is red planet</p>

 

<script type="text/javascript">

var planet = document.getElementById("mars");

var title_Element = planet.getAttribute("title");

document.write("<p> We get the title of the element with id «mars»: «" + title_Element + "»");

</script>

</body>

Результат

Метод getAttribute возвращает null

Our Planet

Green Planet

Red Planet

Mars is red planet

We get the title of the element with id «mars»: «null»

Комментарии к примеру...

  • В этом примере мы пробовали получить значение несуществующего атрибута (у параграфа с индексом mars нет title). В результате метод getAttribute возвращает null.

В таких случаях удобно делать проверку при помощи условия if-else, то есть если атрибута не существует, то выводить сообщение об этом.

Фрагмент кода

<body>

<h1>Our Planet</h1>

<p id="earth" title="Our Planet is beautiful...!!!">Green Planet</p>

<h1>Red Planet</h1>

<p id="mars">Mars is red planet</p>

 

<script type="text/javascript">

var planet = document.getElementById("mars");

var title_Element = planet.getAttribute("title");

if(title_Element == null){

document.write("Вы ошиблись и пытаетесь получить значение несуществующего атрибута!!!")
}
else{

document.write("<p> We get the title of the element with id «mars»: «" + title_Element + "»");
}

</script>

 

</body>

Результат

Результат проверки при помощи условия if-else

Our Planet

Green Planet

Red Planet

Mars is red planet

Вы ошиблись и пытаетесь получить значение несуществующего атрибута!!!



Читайте также...



Отзывы и комментарии:

Комментариев нет...

Оставить отзыв:

Ваше Имя:

Текст комментария:

Ответьте на вопрос:

Сколько дней в Високосном году?


JavaScript и Web

Тематические публикации
Популярные заметки
Последние заметки