Просмотров: 28 106

Jquery. Как получить содержимое тэга или элемента на странице.

Бывают ситуации, что нужно получить внутреннее содержимое элемента (тэга) на странице.

К примеру,

<!DOCTYPE html>
<html>
<head>
</head>
<body>
<div id="elem"><p>Содержимое блока.</p></div>
</body>
</html>

Нужно во всплывающем окне вывести информацию, которая написана внутри элемента div с id=»elem».

Как это можно сделать?

Здесь есть 2 варианта.

1 вариант. Вам нужно получить html-код, который находится внутри элемента.

В этом случае нужно воспользоваться методом html().

селектор.html();

В исходный пример нужно внести совсем небольшие изменения:

<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
</head>
<body>
<div id="elem">Содержимое блока.</div>
<script type="text/javascript">
alert($("#elem").html());
</script>
</body>
</html>

Окно с таким содержимым мы получим в результате.

13-05-2013 15-00-30

Обратите внимание, что все тэги, которые были внутри элемента, тоже будут выведены.

2 вариант. Вам нужно получить только текстовое содержимое.

Для этого нужно внести очень небольшое изменение в скрипт: вместо метода html() воспользоваться методом text().

селектор.text();

Вот, как это будет выглядеть:

<script type="text/javascript">
alert($("#elem").text());
</script>

В результате, в окне будет выведен только текст и все теги будут проигнорированы:

13-05-2013 11-00-55

Хочу сказать, что на практике пользоваться такими методами приходится очень часто, поэтому имейте их в виду и применяйте по месту.

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

Обучающий курс для начинающих по основам работы с веб-аналитикой сайтов на системе Яндекс Метрика здесь.

Страница с описанием моих услуг по веб-аналитике: здесь.

  • Дмитрий

    Здравствуйте!

    А как сделать так, чтоб НЕ ПРИ НАЖАТИИ узнать значение id, у которого id=»just_id»?

    Спасибо!

  • oleg

    var value_off_just_id=$(‘#just_id’).val();

  • Радмир

    А как получить содержимое тега под текстовым курсором?

  • https://plus.google.com/102200355611158227164 Тимур Орлов

    Благодарю, Дмитрий ))