Далее на странице...
Метод 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
Вы ошиблись и пытаетесь получить значение несуществующего атрибута!!!
