如何在本机中获取WebView对象的html源代码

Question

我正在尝试访问第三方网页的HTML源代码,以读取在react-native中的WebView组件中加载的页面的特定DOM元素值.

<WebView
        source={{uri: 'https://www.amazon.com'}}
      />

并假设有一个像这样的DOM元素:

<span class="price bold some-class-name">$459.00</span>

我也试过这个组件但是不能这样做:https: //github.com/alinz/react-native-webview-bridge

有没有办法在WebView和Read特定的DOM元素值中获取页面的当前HTML源代码？

Answer 1

看起来此功能是在React Native v0.37中添加的。添加onMessage参数会将postMessage变量注入到WebView中。然后，您可以正常注入JavaScript，选择您的元素，然后将其发回消息。

render (
  const jsCode = "window.postMessage(document.getElementsByClassName("price bold some-class-name"))"

  return (
     <View style={styles.container}>
         <WebView
             source={{uri: "http://..."}}
             onMessage={this._onMessage}
             injectedJavaScript={jsCode}
         />
     </View>
  );
)