Форум программистов
 
Контакты: о проблемах с регистрацией, почтой и по другим вопросам пишите сюда - alarforum@yandex.ru, проверяйте папку спам! Обязательно пройдите активизацию e-mail.

Вернуться   Форум программистов > Web > JavaScript, Ajax
Регистрация

Восстановить пароль
Повторная активизация e-mail


Донат для форума - использовать для поднятия настроения себе и модераторам

А ещё здесь можно купить рекламу за 25 тыс руб в месяц! ) пишите сюда - alarforum@yandex.ru

Ответ
 
Опции темы
Старый 22.09.2019, 00:06   #1
Blackcement
Новичок
Джуниор
 
Регистрация: 21.09.2019
Сообщений: 5
Репутация: 10
Восклицание Парсить сайт плагином браузера

Здравствуйте.
Возникла необходимость создать плагин для браузера, с помощью которого требуется получать данные с чужого сайта и обрабатывать их. Использую браузер Opera последней версии. В работе плагина используется JavaScrypt, поэтому думаю, что форумом не ошибся.
Плагин состоит из трёх файлов:
manifest.json
Код:
{
	"manifest_version": 2,
	"name": "TEST 1",
	"description": "Test",
	"version": "1.0",
	"background": {	},
	"permissions": ["tabs","http://*/*"],

	"sidebar_action": 
	{
	"default_icon": "icon.png",
	"default_title": "My Sample Extension",
	"default_panel": "panel.html"
	}
}
panel.html Панель(страница) плагина, на которую будем выводить информацию с сайтов
Код:
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>Мой плагин</title>
		<script src="background.js" type="text/javascript"></script>
    </head>
    <body>
        <div id="timer">00</div>
		<br>
		<div id="lght_1">00</div>
		<div id="txt_1">00</div>
		<div id="tt_1">00</div>
		<br>
		<div id="lght_2">00</div>
		<div id="lght_2_1">00</div>
		<div id="txt_2">00</div>
		<div id="tt_2">00</div>
		<br>
		<div id="lght_3">00</div>
		<div id="txt_3">00</div>
		<div id="tt_3">00</div>
    </body>
</html>
background.js Ну и сам скрипт, который будет должен парсить сайты, пробую это делать тремя способами
Код:
sec = 0;
setInterval(tick, 1000);
         
function tick()
{
	var $ = window.jQuery;
    sec++;
    document.getElementById("timer").childNodes[0].nodeValue = sec; //Таймер отрабатывает

	/// TEST-1 [querySelector]
	chrome.tabs.executeScript(null, {code: "document.querySelector('p').innerHTML"}, 
	(results)=>	{document.getElementById("txt_1").childNodes[0].nodeValue = "Текст " + results;}); //Возвращает текст между первыми тегами <p></p> Тут всё ок

	/// TEST-2 [querySelectorAll]
	
	chrome.tabs.executeScript(null, {code: "document.querySelectorAll('p').length"}, 
	(results)=>	{document.getElementById("lght_2").childNodes[0].nodeValue = "Длина массива " + results;}); //Возвращает правильное значение, Тут всё ок
	
	//А вот так, уже не работает:
	chrome.tabs.executeScript(null, {code: "document.querySelectorAll('p')"}, 
	(results)=>	{
		document.getElementById("lght_2_1").childNodes[0].nodeValue = "Длина массива " + results.length; 
		console.log(results);//В консоли возвращает какой-то странный массив и как с ним работать мне не понятно 	
Код:
Вот возвращаемый массив: 
Array(1)
0: {}
length: 1
__proto__: Array(0)
concat: ƒ concat()
constructor: ƒ Array()
copyWithin: ƒ copyWithin()
entries: ƒ entries()
every: ƒ every()
fill: ƒ fill()
filter: ƒ filter()
find: ƒ find()
findIndex: ƒ findIndex()
flat: ƒ flat()
flatMap: ƒ flatMap()
forEach: ƒ forEach()
includes: ƒ includes()
indexOf: ƒ indexOf()
join: ƒ join()
keys: ƒ keys()
lastIndexOf: ƒ lastIndexOf()
length: 0
map: ƒ map()
pop: ƒ pop()
push: ƒ push()
reduce: ƒ reduce()
reduceRight: ƒ reduceRight()
reverse: ƒ reverse()
shift: ƒ shift()
slice: ƒ slice()
some: ƒ some()
sort: ƒ sort()
splice: ƒ splice()
toLocaleString: ƒ toLocaleString()
toString: ƒ toString()
unshift: ƒ unshift()
values: ƒ values()
Symbol(Symbol.iterator): ƒ values()
Symbol(Symbol.unscopables): {copyWithin: true, entries: true, fill: true, find: true, findIndex: true, …}
__proto__: Object
}); chrome.tabs.executeScript(null, {code: "document.querySelectorAll('p').innerHTML"}, (results)=> {document.getElementById("txt_2").childNodes[0].nodeValue = "Текст " + results[0];}); //Возвращает null /// TEST-3 [jQuery] //тут тоже возвращаются какие-то странные массивы, но тоже хочу разобраться, по этому прошу помощи chrome.tabs.executeScript(null, {code: "$('p')"}, (results)=> { document.getElementById("lght_3").childNodes[0].nodeValue = "Длина массива " + results.length; document.getElementById("txt_3").childNodes[0].nodeValue = results[0]; }); };
Помогите, люди добрые, уже второй день бьюсь.
Blackcement вне форума   Ответить с цитированием
Старый 22.09.2019, 00:20   #2
Alex11223
Модератор
Заслуженный модератор
 
Аватар для Alex11223
 
Регистрация: 12.01.2011
Сообщений: 19,299
Репутация: 3739

icq: 512-765
skype: alexp.frl
По умолчанию

Цитата:
Сообщение от Blackcement Посмотреть сообщение
//В консоли возвращает какой-то странный массив и как с ним работать мне не понятно
это обычный массив и его стандартные функции.

Как видно из первых строк, в нем один объект.
Alex11223 вне форума   Ответить с цитированием
Старый 22.09.2019, 00:41   #3
Blackcement
Новичок
Джуниор
 
Регистрация: 21.09.2019
Сообщений: 5
Репутация: 10
По умолчанию

Цитата:
Сообщение от Alex11223 Посмотреть сообщение
это обычный массив и его стандартные функции.

Как видно из первых строк, в нем один объект.
Да, но как выделить из этого массива необходимые мне данные? Я предполагал получить массив, каждый элемент которого будет содержать текст расположенный между тегами <p></p>.
Blackcement вне форума   Ответить с цитированием
Старый 22.09.2019, 00:45   #4
Alex11223
Модератор
Заслуженный модератор
 
Аватар для Alex11223
 
Регистрация: 12.01.2011
Сообщений: 19,299
Репутация: 3739

icq: 512-765
skype: alexp.frl
По умолчанию

смотрите что за объект, какие у него свойства, функции.

Если это результат querySelectorAll, то там же обычные элементы.
https://developer.mozilla.org/en-US/...eb/API/Element
Alex11223 вне форума   Ответить с цитированием
Старый 22.09.2019, 00:47   #5
Вадим Мошев

Заслуженный модератор
 
Аватар для Вадим Мошев
 
Регистрация: 12.11.2010
Адрес: programmersforum
Сообщений: 8,486
Репутация: 4056
По умолчанию

Цитата:
Сообщение от Blackcement Посмотреть сообщение
Да, но как выделить из этого массива необходимые мне данные? Я предполагал получить массив, каждый элемент которого будет содержать текст расположенный между тегами <p></p>.
Код:
let paragraphStrings =  arr
  .filler(e => e.tagName === 'P')
  .map(e => e.textContent)
Вадим Мошев вне форума   Ответить с цитированием
Старый 22.09.2019, 01:34   #6
Blackcement
Новичок
Джуниор
 
Регистрация: 21.09.2019
Сообщений: 5
Репутация: 10
По умолчанию

Цитата:
Сообщение от Alex11223 Посмотреть сообщение
смотрите что за объект, какие у него свойства, функции.

Если это результат querySelectorAll, то там же обычные элементы.
https://developer.mozilla.org/en-US/...eb/API/Element
Посмотрел ссылку, нашел этот метод querySelectorAll(), возвращает он мне массив NodeList. На этой странице https://developer.mozilla.org/en-US/...deList#Example указан пример с простым перебором массива. Делаю по аналогии, получаю NULL.

Код:
var item="";
	chrome.tabs.executeScript(null, {code: "document.querySelectorAll('p')"}, 
	(results)=>	
               {
		document.getElementById("lght_2_1").childNodes[0].nodeValue = "Длина массива " + results.length; 
		for (var i = 0; i < results.length; i++) 
                {
		 item = item + results[i];
                }
		console.log(item);//В консоли получаю undefined
		});
Blackcement вне форума   Ответить с цитированием
Старый 22.09.2019, 01:42   #7
Blackcement
Новичок
Джуниор
 
Регистрация: 21.09.2019
Сообщений: 5
Репутация: 10
По умолчанию

Цитата:
Сообщение от Вадим Мошев Посмотреть сообщение
Код:
let paragraphStrings =  arr
  .filler(e => e.tagName === 'P')
  .map(e => e.textContent)
Спасибо, но однострочные-многоуровневые алгоритмы мне пока сложно понять. Возможно ли этот код разделить построчно? Да что я говорю, я вообще не понимаю как сюда прикрутить полученный массив "results".
Blackcement вне форума   Ответить с цитированием
Старый 22.09.2019, 02:11   #8
Blackcement
Новичок
Джуниор
 
Регистрация: 21.09.2019
Сообщений: 5
Репутация: 10
По умолчанию

Цитата:
Сообщение от Вадим Мошев Посмотреть сообщение
Код:
let paragraphStrings =  arr
  .filler(e => e.tagName === 'P')
  .map(e => e.textContent)
Ой, извините, я понял Вашу мысль, просто гуглил arr.filler и не мог понять, почему поиск выдаёт информацию о филлерах для волос.)))
Попробую Вашим способом, спасибо.

К сожалению, оба способа не помогли, на выходе я опять получаю какой-то NodeList массив

Последний раз редактировалось Blackcement; 22.09.2019 в 02:28.
Blackcement вне форума   Ответить с цитированием
Старый 25.09.2019, 14:25   #9
Вадим Мошев

Заслуженный модератор
 
Аватар для Вадим Мошев
 
Регистрация: 12.11.2010
Адрес: programmersforum
Сообщений: 8,486
Репутация: 4056
По умолчанию

Цитата:
Сообщение от Blackcement Посмотреть сообщение
Ой, извините, я понял Вашу мысль, просто гуглил arr.filler
Извините за опечатку. Конечно, filter. Я ваш код не читал. Могу посоветовать, если вы получаете nodeList, преобразовать его к массиву.
Например, таким образом:
Код:
let realArray = [...nodeList];
Вадим Мошев вне форума   Ответить с цитированием
Ответ

Опции темы

Ваши права в разделе
Вы не можете создавать новые темы
Вы не можете отвечать в темах
Вы не можете прикреплять вложения
Вы не можете редактировать свои сообщения

BB коды Вкл.
Смайлы Вкл.
[IMG] код Вкл.
HTML код Выкл.

Быстрый переход

Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
как парсить https сайт ? alman12 Общие вопросы Delphi 12 25.08.2018 12:58
Как парсить сайт без явного указания города Parallelogram PHP 4 02.08.2015 19:46
Как парсить сайт origin.com JGalt PHP 3 31.01.2015 21:16
Парсить сайт и создать сайт-каталог на этой основе sn600 Фриланс 3 21.09.2013 19:41
Парсить ИМ + создать сайт на этой базе+ залить ключевики в ЯД+ГА sn600 Фриланс 3 21.08.2013 19:35


07:09.


Powered by vBulletin® Version 3.8.11
Copyright ©2000 - 2019, Jelsoft Enterprises Ltd.