javascript - 爬取网页Jquery选择器first-child的问题
本文介绍了javascript - 爬取网页Jquery选择器first-child的问题的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
问 题
在爬取一个网站的时候,
感觉h2 和 h3 是一样的结构,为什么 h2:first-child 可以取到数据, h3就不行。
最终的结果h2_1和h2_2是一样的,没问题。
h3_1是ok的,h3_2是空,请问这是为什么?
代码如下,
const jsdom = require('jsdom');
const jquery = require('jquery');
jsdom.env('https://www.osram.com/os/news-and-events/spotlights/index.jsp', [], {
defaultEncoding: 'utf-8'
}, function(err, window) {
if(err) {
console.error('error get news url from page [%s]');
return;
}
let $ = jquery(window);
let el = $('div.col-xs-6.col-sm-7.colalign:first');
let h2_1 = $(el).find('h2.font-headline-teaser').text();
console.log('h2_1=' + h2_1);
let h2_2 = $(el).find('h2.font-headline-teaser:first-child').text();
console.log('h2_2=' + h2_2);
let h3_1 = $(el).find('h3.font-sub-headline').text();
console.log('h3_1=' + h3_1);
let h3_2 = $(el).find('h3.font-sub-headline:first-child').text();
console.log('h3_2=' + h3_2);
window.close();
});
解决方案
选择器xxx:first-child是指,xxx的父元素的第一个子元素为xxx时,选中xxx,需要同时满足这两个条件。
不是xxx父元素的第一个子元素,也不是xxx的父元素的子元素中第一个xxx
h2.font-headline-teaser的父元素的第一个子元素为h2.font-headline-teaser,所以能选中
h3.font-sub-headline的父元素的第一个子元素不是h3.font-sub-headline,所以为空
这篇关于javascript - 爬取网页Jquery选择器first-child的问题的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文