Question

我正在开发一个简单的Firefox插件，我试图在节点嵌套为的情况下获取IMG的父HREF节点：

<a href="http://somesite.com">
     <div id="some_div">
          <img src="image.jpg" />
     </div>
</a>

或

<a href="http://somesite.com">
     <div id="some_div">
           <span class="some_class">    
               <img src="image.jpg" />
           </span>
     </div>
</a>

使用Firefox SDK，我可以获得IMG SRC链接及其父节点：

var href = node.parentNode.href;

但不是如果HREF节点高于某些水平。

任何有关编写一些纯Javascript代码以帮助＆＃34;攀登＆＃34;在DOM树到达A HREF节点之前，从IMG SRC开始，将非常感激。

修改

通过使用下面的Touffy答案，这是到目前为止的代码：

self.on("click", function (node, data) {
    if (node.nodeName == "A") { 
        var link = node.href; 
    }
    if (node.nodeName == "IMG") {
        var imgsrc = node.src;
        var nodes = document.getElementsByTagName('img');
        var href = nearestAncestorHref(nodes[0]);
    }
    var s = link +  " " + imgsrc + " " + href;
    self.postMessage(s);
});

function nearestAncestorHref(node){
    while(node && !node.href) node=node.parentNode
    return node && node.href
}

但是console.log返回它在整个页面中找到的绝对第一个A HREF。例如，我在bbc.com上尝试了一个随机图像，函数返回http://www.bbc.com而不是我点击的图像的链接。

为什么我可以在使用node.href和node.src时分离HREF和IMG SRC？因为我无法从Firefox SDK获得这两个值，但一次只能获得一个。

Answer 1

这将返回具有href的最近祖先的href，如果它到达null根而没有找到任何内容，则返回<HTML>。

function nearestAncestorHref(node){
  while(node && !node.href) node=node.parentNode
  return node && node.href
}

Answer 2

function getHref(node) {
    if(node.href != null) {
        return node.href;
    } else {
        if(node.parentNode != null) {
             return getHref(node.parentNode);  
        } 
    }
    return null;
}

http://jsfiddle.net/8qy95vzv/

Answer 3

 var href = document.getElementById('some_div').parentNode;

http://jsfiddle.net/ox8r377v/

获取没有Jquery的嵌套父HREF节点

3 个答案: