识别 Safari 扩展中上下文菜单事件的链接

Question

我正在尝试构建一个 safari 扩展（主要用于学习目的），当用户右键单击链接时，它会创建一个美味的书签。我观看了 WWDC 创建 Safari 扩展视频，一切正常。

除了我不知道如何查明用户是否单击了链接（或只是一些文本），如果是，则获取它的网址和标题。到目前为止我得到的是这样的：

document.addEventListener("contextmenu", handleContextMenu, false);
function handleContextMenu(event){
    safari.self.tab.setContextMenuEventUserInfo(event,getSelection().toString());
}

但这显然只给了我一个选择的字符串。现在，根据 Safari 参考库 getSelection() 返回一个 DOMSelection 对象。但即使在那里，我也无法找到一种方法来为我提供所选链接的句柄。

正如您可能注意到的，我对整个 javascript 和 DOM 内容相当陌生，所以如果这是一个明显的问题，请原谅:)

Ciao， 斯文

Answer 1

只需单击鼠标右键，所选内容就会设置在锚链接内。这意味着您将选择其文本节点，但不会选择链接节点本身。因此，尝试在选择内容中查找链接是没有用的。

您可以使用 DOMSelection 的 focusNode 获取最后选定的文本节点并检查其祖先，直到找到 元素。这应该可以满足你的要求。

var link = null;
var currentElement = event.getSelection().focusNode;
while (currentElement != null)
{
    if (currentElement.nodeType == Node.ELEMENT_NODE && currentElement.nodeName.toLowerCase() == 'a')
    {
        link = currentElement;
        break;
    }
    currentElement = currentElement.parentNode;
}
// link is now an <a> element if the user selected a link's contents

Answer 2

zneak的答案对我不起作用，所以我使用 event.target 而不是选择：

var link = evt.target;
// get parent node in case of text nodes (old safari versions)
if(link.nodeType == Node.TEXT_NODE) {
    link = link.parentNode;
}
    // if for some reason, it's not an element node, abort
if(link.nodeType != Node.ELEMENT_NODE) {
    return;
}

// try to get a link element in the parent chain 
while(link != null && 
        currentElement.nodeType == Node.ELEMENT_NODE && 
        link.nodeName.toLowerCase() != "a") {
    link = link.parentNode;
}
if(link) {
   // do stuff
}