JavaScript: собирать значения атрибутов ссылки href, hreflang, rel, target и type

Последнее обновление 9 февраля 2019 08:32:21 (UTC / GMT +8 часов)

script1adsense2code

script1adsense3code

JavaScript DOM: Упражнение-4 с решением

Напишите функцию JavaScript, чтобы получить значения атрибутов href, hreflang, rel, target и type указанной ссылки.

Пример HTML-файла:


<!DOCTYPE html>
<html><head>
<meta charset=utf-8 />
</head>
<body>
<p><a id="w3r" type="text/html" hreflang="en-us" rel="nofollow" target="_self" href="/">w3resource</a></p>
<button onclick="getAttributes()">Click here to get  attributes value</button>
</body></html>

Пример решения : -

HTML-код:

<!DOCTYPE html> 
<html> 
<head> 
<meta charset=utf-8 /> 
<title>Collect the value of href, hreflang, rel, target, and type attributes of a link</title> 
</head> 
<body> 
<p><a id="w3r" type="text/html" hreflang="en-us" rel="nofollow" target="_self" href="/">w3resource</a></p> 
<button onclick="getAttributes()">Click here to get the attribute's value</button>  
</body> 
</html>

Код JavaScript:

function getAttributes()
{
 var u = document.getElementById("w3r").href;
 alert('The value of the href attribute of the link is : '+u);
 var v = document.getElementById("w3r").hreflang;   
 alert('The value of the hreflang attribute of the link is : '+v);
 var w = document.getElementById("w3r").rel; 
  alert('The value of the rel attribute of the link is : '+w);
 var x = document.getElementById("w3r").target; 
  alert('The value of the taget attribute of the link is : '+x);
 var y = document.getElementById("w3r").type; 
  alert('The value of the type attribute of the link is : '+y);  
}

Пример вывода:

Блок - схема:

Демонстрация в реальном времени:

См. Pen javascript-dom-упражнение-4 от w3resource ( @ w3resource ) на CodePen .

Улучшите этот пример решения и опубликуйте свой код через Disqus

Предыдущий: Напишите программу на JavaScript, чтобы установить цвет фона абзаца.
Далее: написать функцию JavaScript для добавления строк в таблицу.