在WKWebView中注入javascript获取点击图片的src属性

Question

我想在 webkitview 中注入一个 javascript 代码，当用户点击它时获取点击图像的 src 属性。我还发现有些图像没有将它们的 src 属性直接放在 img 应答器中，而是通过应答器中的 class 注入的。我发现这个脚本在 webview 中获取了被点击的 Html 元素：

  document.addEventListener("click", function(evt) {
        var tagClicked = document.elementFromPoint(evt.pageX - window.pageXOffset, evt.pageY - window.pageYOffset);
        window.webkit.messageHandlers.jsMessenger.postMessage(tagClicked.outerHTML.toString());
        });

由 class 注入的 src 属性示例：<img alt="Chaussure de football enfant terrains secs Agility 900 FG JR grise et bleue" class="source-medium">

在这种情况下，如果它是图像，我可以从返回的字符串中获取 src 属性，但是如果 src 属性是由 img 应答器中的 class 注入的，我无法从返回的字符串中获取它细绳。任何人都可以帮忙吗？谢谢

Answer 1

您会很高兴知道它比这容易得多，因为事件对象有一个名为 target 的属性，它是被单击的元素。既然你对img元素感兴趣，我们不用担心它是你想要的元素的子元素，所以我们可以直接使用evt.target。

为了使它更容易，HTMLImageElement 对象有一个 src 属性，它提供图像的完整解析 URL，因此：

document.addEventListener("click", function(evt) {
    if (evt.target.tagName === "IMG") {
        window.webkit.messageHandlers.jsMessenger.postMessage(evt.target.src);
    }
});

但如果您真的想要 outerHTML：

document.addEventListener("click", function(evt) {
    if (evt.target.tagName === "IMG") {
        window.webkit.messageHandlers.jsMessenger.postMessage(evt.target.outerHTML);
    }
});

假设这是一个 HTML 页面，您可以相信 tagName 全部大写（即使它不在 HTML 页面被解析的来源中） .

在WKWebView中注入javascript获取点击图片的src属性

inject javascript in WKWebView to get the src attribut of a clicked image

javascript

swift

wkwebview