ios如何获取js标签

iOS如何获取JS标签主要方法包括：使用WKWebView、通过JavaScriptCore框架、利用URL Scheme。使用WKWebView是最常用的方法，因为它提供了丰富的与JavaScript交互的API，便于在iOS应用中执行和获取JavaScript代码的结果。在这篇文章中，我们将详细讨论这些方法，并提供代码示例和使用场景。

一、使用WKWebView

WKWebView是iOS中用于显示网页内容的控件，它可以加载和显示网页，并且可以通过JavaScript与网页内容进行交互。使用WKWebView获取JS标签的步骤主要包括：

1、加载网页内容

首先，需要创建一个WKWebView实例并加载网页内容。

import WebKit
let webView = WKWebView(frame: .zero)
let url = URL(string: "https://example.com")!
let request = URLRequest(url: url)
webView.load(request)

2、执行JavaScript获取标签

一旦网页加载完成，可以通过evaluateJavaScript方法执行JavaScript代码并获取结果。

webView.evaluateJavaScript("document.getElementsByTagName('h1')[0].innerText") { (result, error) in
    if let error = error {
        print("Error executing JavaScript: (error.localizedDescription)")
    } else if let result = result as? String {
        print("H1 Tag Text: (result)")
    }
}

在这个例子中，JavaScript代码获取了第一个<h1>标签的文本内容，并将其返回给Swift代码。

二、通过JavaScriptCore框架

JavaScriptCore是iOS的一个框架，允许在iOS应用中嵌入和执行JavaScript代码。尽管它比WKWebView更底层，但在某些情况下非常有用。

1、创建JSContext

首先，需要创建一个JSContext实例。

import JavaScriptCore
let context = JSContext()!

2、执行JavaScript代码

然后，可以在这个上下文中执行JavaScript代码，并获取结果。

let script = "var h1Tag = document.getElementsByTagName('h1')[0]; h1Tag ? h1Tag.innerText : ''"
if let result = context.evaluateScript(script)?.toString() {
    print("H1 Tag Text: (result)")
}

3、注入网页内容

在实际使用中，可能需要将网页内容注入到JSContext中。可以通过以下方式实现：

let html = "<html><body><h1>Hello World</h1></body></html>"
context.evaluateScript("document.write("(html)")")

三、利用URL Scheme

在某些情况下，可以通过URL Scheme与网页内容进行交互。尽管这种方法不如前两种灵活，但在某些特定场景下非常有效。

1、定义URL Scheme

首先，需要在HTML中定义一个URL Scheme。

<a href="myapp://getH1TagText">Get H1 Tag Text</a>

2、处理URL Scheme

然后，在iOS应用中处理这个URL Scheme。

func application(_ app: UIApplication, open url: URL, options: [UIApplication.OpenURLOptionsKey : Any] = [:]) -> Bool {
    if url.scheme == "myapp" && url.host == "getH1TagText" {
        webView.evaluateJavaScript("document.getElementsByTagName('h1')[0].innerText") { (result, error) in
            if let error = error {
                print("Error executing JavaScript: (error.localizedDescription)")
            } else if let result = result as? String {
                print("H1 Tag Text: (result)")
            }
        }
        return true
    }
    return false
}

四、使用WKWebView与JavaScript交互

1、配置WKWebView

为了更好地与JavaScript交互，可以在创建WKWebView时配置其相关设置。

let webViewConfiguration = WKWebViewConfiguration()
webViewConfiguration.preferences.javaScriptEnabled = true
let webView = WKWebView(frame: .zero, configuration: webViewConfiguration)

2、添加JavaScript消息处理器

可以通过添加JavaScript消息处理器来处理来自网页的消息。

class ScriptMessageHandler: NSObject, WKScriptMessageHandler {
    func userContentController(_ userContentController: WKUserContentController, didReceive message: WKScriptMessage) {
        if message.name == "getH1TagText", let text = message.body as? String {
            print("H1 Tag Text: (text)")
        }
    }
}
let contentController = WKUserContentController()
let messageHandler = ScriptMessageHandler()
contentController.add(messageHandler, name: "getH1TagText")
webViewConfiguration.userContentController = contentController

3、在网页中发送消息

在网页中，可以通过JavaScript发送消息给iOS应用。

<script>
    window.webkit.messageHandlers.getH1TagText.postMessage(document.getElementsByTagName('h1')[0].innerText);
</script>

五、处理复杂的网页内容

在实际开发中，可能需要处理更复杂的网页内容，例如动态加载的内容或需要等待页面完全加载的内容。这里介绍几种处理复杂网页内容的方法。

1、监听网页加载完成事件

可以通过监听网页的加载完成事件来确保页面内容已经完全加载，然后再执行JavaScript代码。

class WebViewNavigationDelegate: NSObject, WKNavigationDelegate {
    func webView(_ webView: WKWebView, didFinish navigation: WKNavigation!) {
        webView.evaluateJavaScript("document.getElementsByTagName('h1')[0].innerText") { (result, error) in
            if let error = error {
                print("Error executing JavaScript: (error.localizedDescription)")
            } else if let result = result as? String {
                print("H1 Tag Text: (result)")
            }
        }
    }
}
let navigationDelegate = WebViewNavigationDelegate()
webView.navigationDelegate = navigationDelegate

2、处理动态加载的内容

对于动态加载的内容，可以使用MutationObserver在JavaScript中监听DOM变化，然后通知iOS应用。

<script>
    var observer = new MutationObserver(function(mutations) {
        mutations.forEach(function(mutation) {
            if (mutation.type === 'childList') {
                window.webkit.messageHandlers.getH1TagText.postMessage(document.getElementsByTagName('h1')[0].innerText);
            }
        });
    });
    var config = { childList: true, subtree: true };
    observer.observe(document.body, config);
</script>

通过这种方式，可以在网页内容发生变化时及时获取新的标签内容。

六、处理跨域问题

在某些情况下，可能会遇到跨域问题，导致无法正确获取网页内容。这里介绍几种解决跨域问题的方法。

1、配置服务器允许跨域请求

可以在服务器端配置允许跨域请求。例如，在Apache服务器中，可以通过添加以下配置来允许跨域请求：

<IfModule mod_headers.c>
    Header set Access-Control-Allow-Origin "*"
</IfModule>

2、使用代理服务器

可以通过使用代理服务器来避免跨域问题。例如，可以在iOS应用中设置一个本地代理服务器，然后通过代理服务器请求目标网页。

let session = URLSession(configuration: .default, delegate: self, delegateQueue: nil)
let url = URL(string: "https://example.com")!
let task = session.dataTask(with: url) { (data, response, error) in
    if let error = error {
        print("Error fetching data: (error.localizedDescription)")
    } else if let data = data, let html = String(data: data, encoding: .utf8) {
        self.webView.loadHTMLString(html, baseURL: url)
    }
}
task.resume()

通过这种方式，可以在iOS应用中加载目标网页的内容，并在本地处理跨域问题。

七、总结

获取JS标签是iOS开发中常见的需求，可以通过多种方法实现，包括使用WKWebView、JavaScriptCore框架和URL Scheme等。使用WKWebView是最常用的方法，因为它提供了丰富的与JavaScript交互的API，便于在iOS应用中执行和获取JavaScript代码的结果。

在处理复杂网页内容和跨域问题时，可以采取监听网页加载完成事件、使用MutationObserver和配置服务器允许跨域请求等方法。通过这些方法，可以在iOS应用中灵活地获取和处理网页中的JS标签内容，从而实现更丰富的功能和用户体验。