使用Puppeteer获取HTML属性的值
使用Puppeteer获取HTML属性的值
提问于 2019-06-06 04:39:20
使用Puppeteer，我使用以下命令选择了一些HTML元素：
await page.$$( 'span.styleNumber' );我可以使用以下命令获取元素的文本：
console.log( await ( await styleNumber.getProperty( 'innerText' ) ).jsonValue() );如何计算元素的data-Color属性的值？
下面是我的脚本：
HTML
<span class="styleNumber" data-Color="Blue">SG1000</span>
<span class="styleNumber" data-Color="Green">SG2000</span>
<span class="styleNumber" data-Color="Red">SG3000</span>木偶表演者
const puppeteer = require( 'puppeteer' );
( async() => {
const browser = await puppeteer.launch();
const page = await browser.newPage();
await page.goto( 'http://www.example.com/sample.php' );
// Get a list of all elements.
var styleNumbers = await page.$$( 'span.styleNumber' );
// Print the style numbers.
for( let styleNumber of styleNumbers ) {
try {
console.log( await ( await styleNumber.getProperty( 'innerText' ) ).jsonValue() );
}
catch( e ) {
console.log( `Could not get the style number:`, e.message );
}
}
await browser.close();
} )();上面的代码将打印：
SG1000
SG2000
SG3000如何获取data-Color属性的值？例如：
console.log( await ( await styleNumber.getAttribute( 'data-Color' ) ) ); // Blue回答 1
Stack Overflow用户
回答已采纳
发布于 2019-06-06 04:46:38
可以通过evaluate方法获取属性值。
await page.evaluate('document.querySelector("span.styleNumber").getAttribute("data-Color")')第二种方式
也可以使用$$eval方法。也称为Array from variable的属性
const attr = await page.$$eval("span.styleNumber", el => el.map(x => x.getAttribute("data-Color")));输出将是
["Blue", "Green", "Red"]您的解决方案
const styleNumbers = await page.$$("span.styleNumber");
for( let styleNumber of styleNumbers ) {
const attr = await page.evaluate(el => el.getAttribute("data-Color"), styleNumber);
}页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/56467696
复制相关文章
相似问题
腾讯云开发者
