如何从嵌套元素中获取文本
How to get text from nested elements
我有一个可用作业列表,已存储在我的临时变量中。我想要分别来自这些工作的一些元素的文本。如何从嵌套的 classes 中获取文本?
在下面的代码中,我在尝试访问文本时将空行打印到我的控制台。
const request = require('request')
const cheerio = require('cheerio')
url = 'https://www.temp.com/jobs'
request(url, (error, response, html) => {
if (!error && response.statusCode == 200){
const $ = cheerio.load(html);
const temp = $('.col-md-12.col-lg-12.col-xs-12.padding-none.job-container.jobs-on-hover')
temp.each(function (i, e) {
console.log($(this).children('.latest-jobs-title.font-16.margin-none.inline-block').text()); // its printing empty lines
});
}
})
HTML 检查代码
有多个元素类似于我在上面的代码中获取的 class 下面的元素。
<div class="col-md-12 col-lg-12 col-xs-12 padding-none job-container
jobs-on-hover">
<div class="col-md-12 col-lg-12 col-xs-12 job-desc-block"
style="margin-top:11px;">
<div class="col-md-11 col-xs-11 col-lg-11 job_listing_alignment"><div
class="col-md-12 col-xs-12 col-lg-12 padding-none"><a
href="https://www.freshersworld.com/jobs/junior-project-fellow-jobs-in-dhanbad-ism-dhanbad-1230705"
target="_blank" title="ISM Dhanbad Recruitments"><h3
class="latest-jobs-title font-16 margin-none
inline-block"><span>ISM Dhanbad</span></h3></a><div>Junior
Project Fellow</div><div class="qualification-block"><span
class="pull-left" title="Education Qualification"><svg
viewBox="0 0 16 16" class="icon-16-16"><use
xmlns:xlink="https://www.w3.org/1999/xlink"
xlink:href="#icon-qualification-svg"></use></svg></span><span
class="qualifications display-block modal-open"><span
class="bold_elig">BE/B.Tech</span>, <span
class="bold_elig">ME/M.Tech</span>, <span
class="bold_elig">MSc</span></span></div></div></div><div
class="col-md-1 col-xs-1 col-lg-1 padding-right-none
padding-left-none job-desc-right"><div class="col-md-12 col-xs-12
col-lg-12 text-ago" style="margin-top:5px;"><span title="Job
posted on"><svg viewBox="0 0 16 16" class="icon-16-16"><use
xmlns:xlink="https://www.w3.org/1999/xlink"
xlink:href="#icon-clock-svg"></use></svg></span><span
class="ago-text">22h</span></div></div></div><div
class="col-md-12 col-xs-12 col-lg-12 view-apply-container"><div
class="col-md-9 col-xs-9 col-lg-9 padding-none padding-top-5"><div
class="col-md-5 col-xs-5 col-lg-5 padding-none"><span
class="pull-left" title="Job Location"><svg viewBox="0 0 16
16" class="icon-16-16"><use
xmlns:xlink="https://www.w3.org/1999/xlink"
xlink:href="#icon-location-svg"></use></svg></span><span
class="job-location display-block modal-open"><span><span><span><a
class="bold_font"
href="/jobs-in-dhanbad/9999015062">Dhanbad</a></span></span></span></span></div><div
class="col-md-4 col-xs-4 col-lg-4 padding-none"><span
title="Last Date for Job Application"><svg viewBox="0 0 16
16" class="icon-16-16"><use
xmlns:xlink="https://www.w3.org/1999/xlink"
xlink:href="#icon-date-svg"></use></svg></span><span
class="display-none">2021-06-19</span><span
class="last-date">Last Date</span><span
class="padding-left-4">27 Jun 21</span></div></div><div
class="col-md-3 col-xs-3 col-lg-3 padding-none"><a
href="https://www.freshersworld.com/jobs/junior-project-fellow-jobs-in-dhanbad-ism-dhanbad-1230705"
target="_blank" class="view-apply-button
view-apply-button-1230705">View & Apply</a></div></div></div>
我想获取 class 元素的文本 ago-text
因为您想使用.find()
方法而不是.children()
方法。 .children()
仅在 DOM 树中下降一级,而 .find()
下降到元素子元素的所有子元素。此外,您只需指定 .job-container
和 .latest-jobs-title
。您不需要查询选择器中的所有 Bootstrap 样式。
我有一个可用作业列表,已存储在我的临时变量中。我想要分别来自这些工作的一些元素的文本。如何从嵌套的 classes 中获取文本?
在下面的代码中,我在尝试访问文本时将空行打印到我的控制台。
const request = require('request')
const cheerio = require('cheerio')
url = 'https://www.temp.com/jobs'
request(url, (error, response, html) => {
if (!error && response.statusCode == 200){
const $ = cheerio.load(html);
const temp = $('.col-md-12.col-lg-12.col-xs-12.padding-none.job-container.jobs-on-hover')
temp.each(function (i, e) {
console.log($(this).children('.latest-jobs-title.font-16.margin-none.inline-block').text()); // its printing empty lines
});
}
})
HTML 检查代码 有多个元素类似于我在上面的代码中获取的 class 下面的元素。
<div class="col-md-12 col-lg-12 col-xs-12 padding-none job-container
jobs-on-hover">
<div class="col-md-12 col-lg-12 col-xs-12 job-desc-block"
style="margin-top:11px;">
<div class="col-md-11 col-xs-11 col-lg-11 job_listing_alignment"><div
class="col-md-12 col-xs-12 col-lg-12 padding-none"><a
href="https://www.freshersworld.com/jobs/junior-project-fellow-jobs-in-dhanbad-ism-dhanbad-1230705"
target="_blank" title="ISM Dhanbad Recruitments"><h3
class="latest-jobs-title font-16 margin-none
inline-block"><span>ISM Dhanbad</span></h3></a><div>Junior
Project Fellow</div><div class="qualification-block"><span
class="pull-left" title="Education Qualification"><svg
viewBox="0 0 16 16" class="icon-16-16"><use
xmlns:xlink="https://www.w3.org/1999/xlink"
xlink:href="#icon-qualification-svg"></use></svg></span><span
class="qualifications display-block modal-open"><span
class="bold_elig">BE/B.Tech</span>, <span
class="bold_elig">ME/M.Tech</span>, <span
class="bold_elig">MSc</span></span></div></div></div><div
class="col-md-1 col-xs-1 col-lg-1 padding-right-none
padding-left-none job-desc-right"><div class="col-md-12 col-xs-12
col-lg-12 text-ago" style="margin-top:5px;"><span title="Job
posted on"><svg viewBox="0 0 16 16" class="icon-16-16"><use
xmlns:xlink="https://www.w3.org/1999/xlink"
xlink:href="#icon-clock-svg"></use></svg></span><span
class="ago-text">22h</span></div></div></div><div
class="col-md-12 col-xs-12 col-lg-12 view-apply-container"><div
class="col-md-9 col-xs-9 col-lg-9 padding-none padding-top-5"><div
class="col-md-5 col-xs-5 col-lg-5 padding-none"><span
class="pull-left" title="Job Location"><svg viewBox="0 0 16
16" class="icon-16-16"><use
xmlns:xlink="https://www.w3.org/1999/xlink"
xlink:href="#icon-location-svg"></use></svg></span><span
class="job-location display-block modal-open"><span><span><span><a
class="bold_font"
href="/jobs-in-dhanbad/9999015062">Dhanbad</a></span></span></span></span></div><div
class="col-md-4 col-xs-4 col-lg-4 padding-none"><span
title="Last Date for Job Application"><svg viewBox="0 0 16
16" class="icon-16-16"><use
xmlns:xlink="https://www.w3.org/1999/xlink"
xlink:href="#icon-date-svg"></use></svg></span><span
class="display-none">2021-06-19</span><span
class="last-date">Last Date</span><span
class="padding-left-4">27 Jun 21</span></div></div><div
class="col-md-3 col-xs-3 col-lg-3 padding-none"><a
href="https://www.freshersworld.com/jobs/junior-project-fellow-jobs-in-dhanbad-ism-dhanbad-1230705"
target="_blank" class="view-apply-button
view-apply-button-1230705">View & Apply</a></div></div></div>
我想获取 class 元素的文本 ago-text
因为您想使用.find()
方法而不是.children()
方法。 .children()
仅在 DOM 树中下降一级,而 .find()
下降到元素子元素的所有子元素。此外,您只需指定 .job-container
和 .latest-jobs-title
。您不需要查询选择器中的所有 Bootstrap 样式。