如何在WKWebView中通过evaluateJavaScript加载MathJax脚本？

别担心，刚接触Swift和JavaScript的时候遇到这种问题太正常了！你想把MathJax的脚本注入到WKWebView里，但直接把HTML的<script>标签传给evaluateJavaScript是行不通的——因为这个方法执行的是JavaScript代码，不是HTML标签。下面给你最适合的实现方式：

方法：通过JavaScript动态插入脚本标签 #

你可以写一段JS代码，让它在页面加载完成后动态创建并插入MathJax的script元素，然后把这段JS代码传给evaluateJavaScript执行。刚好可以放在你提到的webView(_:didFinish:)代理方法里：

func webView(_ webView: WKWebView, didFinish navigation: WKNavigation!) {
    // 构造动态插入MathJax脚本的JS代码
    let injectMathJaxScript = """
    // 创建script元素
    const mathJaxScript = document.createElement('script');
    mathJaxScript.type = 'text/javascript';
    // 设置MathJax的资源地址
    mathJaxScript.src = 'https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.2/MathJax.js?config=default&ver=1.3.8';
    // 把script元素添加到页面头部
    document.head.appendChild(mathJaxScript);
    """
    
    // 执行注入脚本的操作
    webView.evaluateJavaScript(injectMathJaxScript) { result, error in
        if let error = error {
            print("MathJax脚本注入失败：\(error.localizedDescription)")
        } else {
            print("MathJax脚本已成功注入")
        }
    }
}

为什么这么做？ #

这段JS代码的逻辑是：

1. 创建一个新的<script>DOM元素
2. 为它设置你需要的type和src属性
3. 把这个元素添加到页面的<head>标签里，触发浏览器自动加载并执行外部的MathJax脚本

额外注意事项 #

• 一定要在didFinish方法里执行这段代码：只有当页面加载完成后，页面的DOM结构才完全生成，才能找到<head>元素来插入脚本。
• 如果你的页面有内容安全策略（CSP），需要确保策略允许加载cdnjs.cloudflare.com的资源，否则脚本会被浏览器阻止。
• 确保你的App有网络访问权限：因为MathJax是外部资源，需要网络加载，现在HTTPS资源默认是允许的，一般不需要额外配置，但如果遇到问题，可以检查Info.plist里的NSAppTransportSecurity设置。

内容的提问来源于stack exchange，提问作者Rahul Basi