插入带有来自另一个链接greasemonkey文本的链接

Question

我想做的是为我使用的这个论坛的每个线程插入一个链接和 img。链接的 href 应该基于元素的子元素的 href。 这是 HTML 的部分视图，为了清楚起见，我删除了一些内容，如果我采取的太多，请告诉我。最后一个标签重复 20 次左右，具体取决于首选项中可见的线程数

<div id="content">
    <form id="page_form">
        <div id="forums">
            <table class="grid forumtable">
                <tr></tr>
                <tr></tr>
                <tr>
                    <td></td>
                    <td></td>
                    <td></td>
                    <td>
                    <div class="lastposter">
                        <a></a>
                        <a href="view/1234/?page=last#845612"><img></img></a>
                    </div>
                    </td>
                </tr>
                <tr> ...same as above.. x20 </tr>
            </table>
        </div>
    </form>
</div>

到目前为止，这是我的代码，它通过插入静态链接来工作。我想要的是使用上一个链接中#之后的值的链接。

var lastpst = document.getElementsByClassName('lastposter');
for (var i=0; i < lastpst.length; i++){
 links = document.createElement('a');
 links.setAttribute('href','we.html');
 links.innerHTML ='<a href="we.html"><img src="/static/img/silk/zoom.png" /></a>';
 lastpst[i].appendChild(links);
}

那么如何从 lastpst[i] 访问 a 标签并使用 href 创建自己的链接？

我认为可以使用 XPATH 编写此代码，但我无法完全理解它。在这种情况下会是个好主意吗？

抱歉这个冗长的问题。

Answer 1

继续您自己的响应，您应该真正自己处理 DOM 操作，而不是将其插入另一个标签中。另外，将 A 标签放在 A 标签中可能是个坏主意。

var lastpst = document.getElementsByClassName('lastposter');

for (var i=0; i < lastpst.length; i++){
    l = lastpst[i].getElementsByTagName('a');
    ln = l[1].getAttribute('href');
    ln = ln.replace(/(?:.*?)#([0-9]{6})/,'/post/view/$1');

    links = document.createElement('a');
    links.href = ln;

    img = document.createElement('img');
    img.src = "/static/img/silk/zoom.png"
    links.appendChild(img);

    lastpst[i].appendChild(links);
}

Answer 2

首先，在上面的代码示例中，您意识到您正在创建一个链接（A 标记），然后通过 innerHTML 在其中嵌套第二个链接？你可能不想这样做......

如果我正确理解了这个问题，我会这样做：

var lastpst = document.getElementsByClassName('lastposter');
for (var i=0; i < lastpst.length; i++){

 var secondLink = lastpst[i].getElementsByTagName('a')[1];
 var secondLink = secondLink.href;

 // whatever you need your own code to do...
}

希望这会有所帮助。

Answer 3

实际上我想我解决了..（感谢 michael，感谢您的输入，我已修复此代码）

var lastpst = document.getElementsByClassName('lastposter');

for (var i=0; i < lastpst.length; i++){
 l = lastpst[i].getElementsByTagName('a')[1];
 ln = l.getAttribute('href');
 ln = ln.replace(/(?:.*?)#([0-9]{6})/,'/post/view/$1');

 links = document.createElement('a');
 links.setAttribute('href',ln);
 links.innerHTML ='<img src="/static/img/silk/zoom.png" />';
 lastpst[i].appendChild(links);
}

有人发现这有什么问题吗？