web-dev-qa-db-ja.com

操り人形師：内部HTMLを取得する

誰かがinnerHTMLまたは要素のテキストを取得する方法を知っていますか？またはさらに良い;特定のinnerHTMLを持つ要素をクリックする方法。これは通常のJavaScriptでどのように動作するかです：

var found = false
$(selector).each(function() {
                if (found) return;
                else if ($(this).text().replace(/[^0-9]/g, '') === '5' {
                    $(this).trigger('click');
                    found = true
                }

助けてくれてありがとう！

javascriptnode.jsseleniumwebautomationpuppeteer
12
Noah

これは私がinnerHTMLを取得する方法です：

page.$eval(selector, (element) => {
  return element.innerHTML
})
17
Ryan

これは操り人形で動作するはずです:)

const page = await browser.newPage();
const title = await page.evaluate(el => el.innerHTML, await page.$('h1'));
7
E. Fortes

page.$$(selector) を利用してすべてのターゲット要素を取得し、 page.evaluate() を使用してcontent（innerHTML）、次に条件を適用します。次のようになります。

const targetEls = await page.$$('yourFancySelector');
for(let target of targetEls){
  const iHtml = await page.evaluate(el => el.innerHTML, target); 
  if (iHtml.replace(/[^0-9]/g, '') === '5') {
    await target.click();
    break;
  }
}
4
LeOn - Han Li

あなたの質問のこの部分に関して...

"またはさらに良い。特定のinnerHTMLを持つ要素をクリックする方法。"

InnerHTML、innerText、textContentには particulars があり、あなたを悲しませます。 Puppeteer v1.1.1 で十分に緩やかなXPathクエリを使用して回避することができます。

このようなもの：

const el = await page.$x('//*[text()[contains(., "search-text-here")]]');
await el[0].click({     
                button: 'left',
                clickCount: 1,
                delay: 50
            });

そのクエリからElementHandlesの配列を取得することに注意してください。テキストが一意でない場合、探している特定のアイテムは[0]にない可能性があります。

Options .click（）に渡されるのは、必要なのが1回の左クリックだけである場合は不要です。

3
rwinscot

.innerHtmlを確実に動作させることはできません。私はいつも次のことをしています：

let els = page.$$('selector');
for (let el of els) {
  let content = await (await el.getProperty('textContent')).jsonValue();
}

次に、「content」変数にテキストを入力します。

1
JMDE

以下のように書くことができます。 （最後の部分に文を待つ必要はありません）const center = await page.$eval('h2.font-34.uppercase > strong', e => e.innerHTML);

0
Naga