JavaScript добавление элемента

Заметка содержит пример добавления произвольных элементов HTML на веб-страницу стандартными средствами JavaScript.

Следующий код позволит читателю добавить ссылку на мой сайт к элементу с id равным значению «prilepit»:

var download = document.createElement('a'); 
download.innerHTML = 'Посетить мой сайт';
download.rel = 'nofollow';
download.target = '_blank';
download.href = 'http://red-book-cms.ru/';
document.getElementById('prilepit').appendChild(download);

Чтобы при выполнении скрипта не возникло ошибки

‘document.getElementById(…)’ -  есть null или не является объектом

JavaScript должен выполняться после того, как будет загружен HTML с искомым идентификатором. Смотрим полное содержимое пример ниже:

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8" />
  <title>JavaScript добавление элемента</title>
</head>
<body>
<div>
  <p id="prilepit">К этому абзацу прилепится гиперссылка.</p>
  <p>А вот данная надпись останется без изменений.</p>
</div>
<script type="text/javascript">
var download = document.createElement('a'); 
download.innerHTML = 'Посетить мой сайт';
download.rel = 'nofollow';
download.target = '_blank';
download.href = 'http://red-book-cms.ru/';
document.getElementById('prilepit').appendChild(download);
</script>
</body>
</html>

В результате запуска описанного первый исходный абзац с текстом будет выглядеть вот так:

<p id="prilepit">К этому абзацу прилепится гиперссылка.<a rel="nofollow" target="_blank" href="http://red-book-cms.ru/">Посетить мой сайт</a></p>
Опубликовано 1-03-2013 в 15:13


Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *

Можно использовать следующие HTML-теги и атрибуты: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>











Свежие комментарии

  • krasnov8953: к записи Не работает как мне кажется строчка $newTvId = $ »
  • Dimanski: к записи ничего не понимаю. Ставлю ModX на хостинг r01.ru »
  • Дмитрий: к записи Спасибо! Очень выручили. С битриксом беда, а прав »
  • леонид: к записи как сделать что были в ряд? у меня получается по о »
  • Администратор: к записи Статический IP. »
  • Steel: к записи Администратор, вы данную проблему решили подключен »
  • Дмитрий: к записи Хотел узнать как прикрутить данное окно (http://re »

Последние твиты