Как получить данные из контейнера DIV со страницы сайта загруженного в браузер в мою программу на JS...

Рейтинг: 5 из 5, голосов 1
+++++
Как получить данные из контейнера DIV со страницы сайта загруженного в браузер в мою программу на JS ? Я только учусь и не понимаю вот чего Моя программа получается должна быть вставлена в код загруженной страницы, или работать на соседней вкладке ? Какова структура управления страницей ? Я не понимаю как мне получить доступ к данным сайта если я пока научился запускать свою программу в отдельной вкладке браузера. Просто укажите пожалуйста куда копать чтобы такое сделать. Спасибо! С уважением MADZX
Ответ:

Чтобы решить поставленную вами задачу, необходимо подключить код вашей программы к странице сайта (к HTML документу). Есть несколько способов как это можно сделать. Обычно оптимальным вариантом является создание отдельного файла JS и его подключение с помощью тега <script>, в примере ниже показан еще один способ - это вставка кода прогаммы непосредственно в HTML документ перед закрывающим тегом </body>.

Чтобы получить контент блока, необходимо присвоить выбранному блоку атрибут id и далее в коде вашего JS скрипта выполнить команду: document.getElementById('ID_вашего_блока').innerHTML .

Ниже привел пример, вывода контента блока <div> с помощью JavaScript. Протестировать приведенный код вы также можете в нашем онлайн редакторе по ссылке: https://guruweba.com/code/primer-vyvoda-kontenta-bloka-div-s-pomoschyu-javascript/.

Также нужно отметить, что на практике использовать id для получения доступа к элементам страницы не всегда удобно. С счастью, существует библиотека JavaScript JQuery, позволяющая получать доступ к элементам страницы с помощью селекторов CSS, а также содержащая множество других полезных функций. Поэтому, когда разберетесь с основами, рекомендую обратить внимание на JQuery.

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Вывод текста блока с помощью JavaScript</title>
</head>
<body>
<div id="content">Текст блока, который необходимо вывести.</div>
<br />
<br />
<button id="alert_content_btn">Вывести контент в уведомлении</button>

<script type="text/javascript">
/* Формируем переменную, которая будет содержать контент блока */
var content = document.getElementById('content').innerHTML;

/* Вывод контента блока в консоль браузера */
console.log(content);

/* Вывод контента блока всплывающим уведомлением по нажатию на кнопку */
document.getElementById('alert_content_btn').addEventListener("click", function () {
alert(content);
});
</script>
</body>
</html>
1
Оцените, насколько полезна эта страница
+++++
Оставьте комментарий

Отправляя форму, я даю согласие на обработку персональных данных.