Web组件有办法获取到H5页面的标题吗 HarmonyOS 鸿蒙Next

Web组件有办法获取到H5页面的标题吗 HarmonyOS 鸿蒙Next 【设备信息】Mate60

【API版本】Api13

【DevEco Studio版本】5.0.7.200

【问题描述】

Web组件有办法获取到H5页面的标题吗，或者解析URL获取页面标题吗？

2 回复

可以通过执行JavaScript代码来获取文档的标题：

Web({ src: 'www.baidu.com', controller: this.controller })
  .onTitleReceive((event) => {
    if (event) {
      console.log('title:' + event.title);
    }
  })
  .onPageEnd(() => {
    this.controller.runJavaScript('document.title', (error, result) => {
      if (error) {
        console.error('Error getting page title:', error);
      } else {
        console.log('Page title:', result);
      }
    });
  })

2、可以监听页面加载完成的事件：

Web({ src: 'www.baidu.com', controller: this.controller })
  .onTitleReceive((event) => {
    if (event) {
      console.log('title:' + event.title);
    }
  })

更多关于Web组件有办法获取到H5页面的标题吗 HarmonyOS 鸿蒙Next的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html


在HarmonyOS鸿蒙Next中，Web组件可以通过WebView的getTitle()方法来获取H5页面的标题。具体实现如下：

  1. 首先，确保你已经创建了一个WebView组件。
  2. 使用WebView的getTitle()方法，可以在页面加载完成后获取到H5页面的标题。

示例代码：

import webView from '@ohos.web.webview';

let webViewInstance = webView.createWebView();
webViewInstance.loadUrl('https://example.com');

webViewInstance.onPageFinished((event) => {
    let title = webViewInstance.getTitle();
    console.log('H5页面标题:', title);
});

在这个例子中，onPageFinished事件会在页面加载完成后触发，此时调用getTitle()方法即可获取H5页面的标题。

回到顶部