如何在文件中正确传输DOM元素?

时间:2018-03-21 10:27:55

标签: javascript node.js puppeteer

我有一个函数,它接受标记名称和文本作为输入,并返回由给定标记组成的所有元素,包含给定文本作为输出(我得到一个包含匹配文本的所有元素的数组)。

我将在多个函数中使用此函数,因此我认为我可以将其保存在另一个文件中并将该函数导入到我可能需要的所有其他文件中但我无法传输该元素。我正在使用木偶操作员打开浏览器并获取我所需的文件。

我导入的代码:

commonFunctions.js:
module.exports = {
    matchTagAndTextContents: async function matchTagAndTextContents(page, selector, text) {
        const ele = await page.evaluate((selector,text) => {
            function matchTagAndText(sel, txt) {
                var elements = document.querySelectorAll(selector);
                return Array.prototype.filter.call(elements, function(element){
                    return RegExp(text).test(element.textContent);
                });
            }
            const matchedElements = matchTagAndText(selector,text);
            return matchedElements;
        },selector,text);
        return ele;
    }
}

我尝试使用导入函数的另一个文件:

foo.js:
const commonFunctions = require('./commonFunctions');
const puppeteer = require('puppeteer');

let browser = null;
browser = await puppeteer.launch({args: ['--no-sandbox', '--disable-setuid-sandbox']});

(async () => {
    let page = await browser.newPage();
    await page.goto("https://www.google.com");
    let elem = null; 
    await commonFunctions.matchTagAndTextContents(page,'h1','Google').then( res => {
        elem = res;
    });
    await page.evaluate((elem) => {
        elem.forEach( el => {
            el.click();
        })
    },elem);
})();

这里面foo.js我一直得到el.click()不是函数,但如果我在commonFunctions.js中实现forEach,如:

matchedElements.forEach( el => {
    el.click();
});

它可以工作,点击元素。我做错了什么?

1 个答案:

答案 0 :(得分:0)

多数是因为elem在执行中为空,并且在评估范围内将其分配给elem。

尝试更改

    let elem = null; 
await commonFunctions.matchTagAndTextContents(page,'h1','Google').then( res => {
    elem = res;
});
await page.evaluate((elem) => {
    elem.forEach( el => {
        el.click();
    })
},elem);

蒙山

var elem = null; 
elem = await commonFunctions.matchTagAndTextContents(page,'h1','Google');
await page.evaluate((elem) => {
    elem.forEach( el => {
        el.click();
    })
},elem);