Как очистить текст с веб-страницы, используя его заголовок или комбинацию div id + классы?
Так что это может быть довольно широкий вопрос, но я все еще довольно новый и хотел узнать, как мне этого добиться, чтобы я мог закончить свой проект!
Я работаю над freecodecamps «Random Quote Machine», которая использует API для извлечения случайных кавычек, используя AJAX и JSON. Я хотел попробовать сделать все возможное, перебрав все цитаты с этого сайта: https://www.brainyquote.com/quotes/keywords/deep.html
Просматривая консоль, я заметил, что все кавычки находятся в отдельных элементах div с названиями «view quote» или «view author», а также с классами в формате «b-qt qt_xxxxxx», где xxxxxx = случайные 6 цифр.
Сейчас у меня не было большого опыта использования запросов GET или каких-либо серверных частей вообще, но я думаю, что это может быть хорошим шагом в понимании того, как получить данные с веб-сайта, а затем проанализировать их, чтобы я мог использовать их для своей выгоды.
Может кто-нибудь предложить какое-либо понимание того, как я могу добиться, потянув текст цитаты и автора по крайней мере 100 цитат, если не больше? С какими проблемами я могу столкнуться?
Спасибо!
Решение
Есть ли конкретный URL, который вы хотите, этот URL, похоже, не использует страницы, поэтому я написал что-то для очистки домашней страницы, но пока ничего больше.
Вот как бы я это сделал. Я использую PHP, чтобы обойти ограничения на перекрестные источники и хранить всю информацию в кавычках ul #. Я использую AJAX, чтобы получить страницу PHP.
Примечание: загрузка занимает секунду, потому что вы загружаете веб-страницу в фоновом режиме.
<?php
if (!empty($_GET['url'])) {
echo file_get_contents($_GET['url']);
die();
}
?>
<ul id="quotes">
</ul>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<script>
$.get("?url=https://www.brainyquote.com/quotes/keywords/deep.html", function (data) {
$dom = $(data);
$dom.find(".oncl_q").each(function () {
if (!$(this).find("img").length)
$("#quotes").append("<li>" + $(this).html() + "</li>");
});
})
</script>
Прокомментируйте, если вам нужна дополнительная помощь.
Другие решения
Других решений пока нет …