Парсер HTML через JQuery(часть страницы)
Здравствуйте, Уважаемые!
Знания JQuery и js на начальном уровне, поэтому прошу вашей помощи, т.к. второй день борюсь с проблемой. Пишу парсер при помощи Google Chrome Extension, вернее только разбираюсь. Есть много информации по теме, но всё не то. Отступим от пояснений, и к сути вопроса... Есть main.html: <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ru" lang="ru"> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8"/> <title>xdParser v1.1</title> <link href="css/main.css" rel="stylesheet"/> <script type="text/javascript" src="/js/jquery-1.7.2.min.js"></script> <script type="text/javascript" src="/js/main.js"></script> </head> <body> <img id="progress" src="/css/images/progress.gif"/> <input id="starter" type="button" value="Запустить парсер"/> <div id="resultbox"> </div> </body> </html> Есть main.js: (function($){
function ajaxStart(){
$('#progress').show();
}
function ajaxStop(){
$('#progress').hide();
}
function parserGo(){
ajaxStart();
var mypage = $.ajax('http://test.html');
mypage.done(function (data) {
analysisSite(data);
ajaxStop();
});
mypage.fail(function (e, g, f) {
alert('Epic Fail');
ajaxStop();
})
}
function analysisSite(data){
var res = '';
$(data).find('td a').each(function(){
res+=$(this).text()+'=>'+$(this).attr('href')+'<br/>';
})
$('#resultbox').html(res);
}
$(function(){
$('#progress').hide();
$('#starter').click(parserGo);
});
})(jQuery);
Вот пример страницы, которую будем парсерить test.html на удалённом сервере: <body> ... <h4>Текст 1</h4> <table><!--тут ссылка вложеная в тег td--></table> <table><!--тут ссылка вложеная в тег td--></table> <h4>Текст 2</h4> <table><!--тут ссылка вложеная в тег td--></table> <table><!--тут ссылка вложеная в тег td--></table> <h4>Текст 3</h4> <table><!--тут ссылка вложеная в тег td--></table> <table><!--тут ссылка вложеная в тег td--></table> и т.д. ... </body> Скрипт рабочий и проверен в полевых условиях, но выводит все ссылки в тегах td, есть статья по которой всё это проделывал. Вопрос: Как мне достать ссылки только между "Текст 1" и "Текст 2"? Буду очень признателен за пример кода или полезные ссылки, спасибо! |
foxstrager,
Вы это искали ? <!DOCTYPE HTML>
<html>
<head>
<title></title>
<meta charset="utf-8" />
<script src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body>
<h4>Текст 1</h4>
<table><tr><td><a href="#">тут ссылка вложеная в тег td</a></td></tr></table>
<table><tr><td><a href="#">тут ссылка вложеная в тег td</a></td></tr></table>
<h4>Текст 2</h4>
<table><tr><td><a href="#">тут ссылка вложеная в тег td</a></td></tr></table>
<table><tr><td><a href="#">тут ссылка вложеная в тег td</a></td></tr></table>
<h4>Текст 3</h4>
<table><tr><td><a href="#">тут ссылка вложеная в тег td</a></td></tr></table>
<table><tr><td><a href="#">тут ссылка вложеная в тег td</a></td></tr></table>
<script type="text/javascript">
$(":header:contains('Текст 1')").nextUntil(':header').find('a').css("background-color", "#66FFFF");
$(":header:contains('Текст 2')").nextUntil(':header').find('a').css("background-color", "#33FF00");
$(":header:contains('Текст 3')").nextUntil(':header').find('a').css("background-color", "#FFFF33");
</script>
</body>
</html>
|
Спасибо, это как раз то, что мне нужно.
А можно брать значения определённых ссылок, например, обозначенные только голубым(между ""Текст 1" и "Текст 2")? Если быть точнее, то начинать брать значения ссылок от "Текст 1" и заканчивать когда начинается "Тектс 2". <!DOCTYPE HTML> <html> <head> <title></title> <meta charset="utf-8" /> <script src="http://code.jquery.com/jquery-latest.js"></script> </head> <body> <h4>Текст 1</h4> <table><tr><td><a href="#">тут ссылка 1</a></td></tr></table> <table><tr><td><a href="#">тут ссылка 2</a></td></tr></table> <h4>Текст 2</h4> <table><tr><td><a href="#">тут ссылка 3</a></td></tr></table> <table><tr><td><a href="#">тут ссылка 4</a></td></tr></table> <h4>Текст 3</h4> <table><tr><td><a href="#">тут ссылка 5</a></td></tr></table> <table><tr><td><a href="#">тут ссылка 6</a></td></tr></table> </body> </html> |
foxstrager,
в последнем случае предела поиска нет nextUntil(':header') поэтому будет искать до конца страницы, учтите этот момент. |
А подскажите, как сделать в моём случае...
Можно ли использовать эту функцию и кучу условий, чтобы выделить фрагмент? |
<script src="http://code.jquery.com/jquery-latest.js"></script>
<body>
<h4>Текст 1</h4>
<table><tr><td><a href="#">тут ссылка 1</a></td></tr></table>
<table><tr><td><a href="#">тут ссылка 2</a></td></tr></table>
<h4>Текст 2</h4>
<table><tr><td><a href="#">тут ссылка 3</a></td></tr></table>
<table><tr><td><a href="#">тут ссылка 4</a></td></tr></table>
<h4>Текст 3</h4>
<table><tr><td><a href="#">тут ссылка 5</a></td></tr></table>
<table><tr><td><a href="#">тут ссылка 6</a></td></tr></table>
<script>
function Find(X1,X2){
var arr0 =[];
$("h4:contains('"+X2+"')").prevAll().each(function(){
if($(this).html()== X1) return false;
$(this).addClass("Find");
});
$(".Find td a").each(function(){
arr0.push($(this).parent().html());
});
$(".Find").removeClass("Find");
return arr0;
}
var X1 = 'Текст 1';
var X2 = 'Текст 2';
var arr = Find(X1,X2);
alert('Найдено между: "'+X1+'" и "'+X2+'"\n\n'+arr.join(",\n"))
var X1 = 'Текст 2';
var X2 = 'Текст 3';
var arr = Find(X1,X2);
alert('Найдено между: "'+X1+'" и "'+X2+'"\n\n'+arr.join(",\n"))
</script>
</body>
|
Цитата:
Цитата:
выборка есть в первом скрипте а уж потом что хотите то и делайте со ссылками. <!DOCTYPE HTML>
<html>
<head>
<title></title>
<meta charset="utf-8" />
<script src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body>
<div id="resultbox"></div>
<h4>Текст 1</h4>
<table><tr><td><a href="#">тут ссылка 1</a></td></tr></table>
<table><tr><td><a href="#">тут ссылка 2</a></td></tr></table>
<h4>Текст 2</h4>
<table><tr><td><a href="#">тут ссылка 3</a></td></tr></table>
<table><tr><td><a href="#">тут ссылка 4</a></td></tr></table>
<h4>Текст 3</h4>
<table><tr><td><a href="#">тут ссылка 5</a></td></tr></table>
<table><tr><td><a href="#">тут ссылка 6</a></td></tr></table>
<script type="text/javascript">
var marker = 'Текст 1'
var res = '';
$(":header:contains('"+marker+"')").nextUntil(':header').find('a').
each(function(){
res+=$(this).text()+'=>'+$(this).attr('href')+'<br/>';
});
$('#resultbox').html(res);
</script>
</body>
</html>
|
Спасибо большое, очень помогли!
|
foxstrager,
Вариант если очень хочется с двумя маркерами ... но и выше с одним прекрасно работают. <!DOCTYPE HTML>
<html>
<head>
<title></title>
<meta charset="utf-8" />
<script src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body>
<div id="resultbox"></div>
<h4>Текст 1</h4>
<table><tr><td><a href="#">тут ссылка 1</a></td></tr></table>
<table><tr><td><a href="#">тут ссылка 2</a></td></tr></table>
<h4>Текст 2</h4>
<table><tr><td><a href="#">тут ссылка 3</a></td></tr></table>
<table><tr><td><a href="#">тут ссылка 4</a></td></tr></table>
<h4>Текст 3</h4>
<table><tr><td><a href="#">тут ссылка 5</a></td></tr></table>
<table><tr><td><a href="#">тут ссылка 6</a></td></tr></table>
<script type="text/javascript">
var marker = 'Текст 1';
var next_marker = 'Текст 2';
var res = '';
$(":header:contains('"+marker+"')").nextUntil(":header:contains('"+next_marker+"')").find('a').
each(function(){
res+=$(this).text()+'=>'+$(this).attr('href')+'<br/>';
});
$('#resultbox').html(res);
</script>
</body>
</html>
|
Спасибо всем большое, буду вникать в исходники :write:
|
| Часовой пояс GMT +3, время: 12:19. |