在WKWebView中加载网站后，如何检测元素何时可见

Question

我正在尝试加载一个公交网站，这样我就可以抓取给定站点的停靠时间。加载url后，稍后会通过javascript动态加载停止时间。我的目标是用一类"停止时间"来检测元素的存在。如果html中存在这些元素，我就可以解析html。但在解析html之前，我必须等待这些类为"stop-time"的元素出现。我通读了一堆其他的SO问题，但我无法把它们拼凑起来。我正在实现didReceive消息函数，但我真的不确定如何加载javascript，我需要检测元素的存在(类为"stop-time"的元素(。我成功地注入了一些javascript来防止位置权限弹出窗口显示。

override func viewDidLoad() {
super.viewDidLoad()
let contentController = WKUserContentController()
let scriptSource = "navigator.geolocation.getCurrentPosition = function(success, error, options) {}; navigator.geolocation.watchPosition = function(success, error, options) {}; navigator.geolocation.clearWatch = function(id) {};"
let script = WKUserScript(source: scriptSource, injectionTime: .atDocumentStart, forMainFrameOnly: true)
contentController.addUserScript(script)
let config = WKWebViewConfiguration()
config.userContentController = contentController
webView = WKWebView(frame: .zero, configuration: config)
self.view = self.webView!
loadStopTimes("https://www.website.com/stop/1000")
}
func loadStopTimes(_ busUrl: String) {
let urlString = busUrl
let url = URL(string: urlString)!
let urlRequest = URLRequest(url: url)
webView?.load(urlRequest)
}
func userContentController(_ userContentController: WKUserContentController, didReceive message: WKScriptMessage) {
if(message.name == "stopTimesLoaded") {
// stop times now present so take the html and parse the stop times
}
}

Answer 1

首先，您需要注入下一个脚本来通过突变观测器检测元素的出现：

var observer = new MutationObserver(function(mutations) {
mutations.forEach(function(mutation) {
console.log('mutation.type = ' + mutation.type);
for (var i = 0; i < mutation.addedNodes.length; i++) {
var node = mutation.addedNodes[i];
if (node.nodeType == Node.ELEMENT_NODE && node.className == 'stop-time') {
var content = node.textContent;
console.log('  "' + content + '" added');
window.webkit.messageHandlers.stopTimesLoaded.postMessage({ data: content });
}
}
});
});
observer.observe(document, { childList: true, subtree: true });

然后您需要订阅事件"stopTimesLoaded"：

contentController.add(self, name: "stopTimesLoaded")

最后添加代码以处理中的数据

func userContentController(_ userContentController: WKUserContentController, didReceive message: WKScriptMessage)