在 Playwright for Python 中，如何从框架 (iframe) 中检索元素的句柄？

Question

我已在 python 中成功使用 Playwright 从页面中获取元素。我现在运行开始挑战从嵌入在 iframe. As an example, I used the w3schools page explaining the <option> element 中的文档获取元素，它在 iframe 中显示结果。我正在尝试从 iframe 中检索此 <option> 元素的句柄。

使用 page.querySelector() 获取页面上元素的 'normal' 方法无法获取 elementHandle，这只会打印 <class 'NoneType'>:

with sync_playwright() as p:
    for browser_type in [p.chromium, p.firefox, p.webkit]:
        browser = browser_type.launch(headless=False)
        page = browser.newPage()
        page.goto('https://www.w3schools.com/tags/tryit.asp?filename=tryhtml_option')
        element = page.querySelector('select')
        print(type(element))
        browser.close()

我首先尝试明确获取 iframe 的句柄，但这会产生相同的结果 (<class 'NoneType'>):

with sync_playwright() as p:
    for browser_type in [p.chromium, p.firefox, p.webkit]:
        browser = browser_type.launch(headless=False)
        page = browser.newPage()
        page.goto('https://www.w3schools.com/tags/tryit.asp?filename=tryhtml_option')      
        iframe = page.querySelector('iframe')
        element = iframe.querySelector('select')
        print(type(element))
        browser.close()

如何从 iframe 中获取内容？

Answer 1

原来我很接近，但为了正确获取 iframe，我需要调用 contentFrame() 方法。

Returns the content frame for element handles referencing iframe nodes, or null otherwise

然后，querySelector()将return相应的elementHandle就好了：

with sync_playwright() as p:
    for browser_type in [p.chromium, p.firefox, p.webkit]:
        browser = browser_type.launch(headless=False)
        page = browser.newPage()
        page.goto('https://www.w3schools.com/tags/tryit.asp?filename=tryhtml_option')
        iframe = page.querySelector('iframe').contentFrame()
        element = iframe.querySelector('select')
        print(type(element))
        print(element.innerHTML())
        browser.close()

成功打印

<class 'playwright.sync_api.ElementHandle'>

  <option value="volvo">Volvo</option>
  <option value="saab">Saab</option>
  <option value="opel">Opel</option>
  <option value="audi">Audi</option>

注意：如果有多个iframe，在获取句柄时可以只使用一个属性。在上例中通过 id 获取 iframe，例如使用

iframe = page.querySelector('iframe[id=\"iframeResult\"]').contentFrame()

Answer 2

querySelector 将 return 和 ElementHandle。在这种情况下，它将是 iFrame 但作为页面元素。如果您想从该元素中获取 frame，您需要调用 contentFrame，并从那里处理该帧。

iframe = page.querySelector('#iframeResult').contentFrame()
element = iframe.querySelector('select')
print(type(element))

在 Playwright for Python 中，如何从框架 (iframe) 中检索元素的句柄？

In Playwright for Python, how do I retrieve a handle for elements from within an frame (iframe)?

python

iframe

webautomation

playwright

playwright-python