如何获取网站的最后一个锚元素

I am in need of obtaining the very last anchor of a website, regardless of the DOM tree structure.

无论DOM树结构如何,我都需要获取网站的最后一个锚点。

I have tried:

我努力了:

$(document).ready(function(){
    var lastAnchor = $(this).find("a:last-child");
    alert(lastAnchor);
});

However I get all the last anchors that exist inside any element, which contains at least one anchor in it. I understand that this can be converted into an array and from there one may extract the last element... but that's just not the right approach. So what is the right approach?

但是我得到了任何元素中存在的所有最后一个锚点,其中至少包含一个锚点。我知道这可以转换成数组,从那里可以提取最后一个元素......但这不是正确的方法。那么正确的方法是什么?

Fun fact: After messing around with the selectors for some time I came up with:

有趣的事实:在选择器搞砸了一段时间之后我想出了:

$(this).find("a:last-child").find(":last-child")

Which lead to the obvious improvement:

这导致了明显的改善:

$(this).find("a:last-child :last-child")

But I find this solution to be both inefficient and cumbersome. I refuse to believe that a better selector does not exist.

但我觉得这个解决方案既低效又麻烦。我拒绝相信不存在更好的选择器。

I think I am missing something obvious but it hasn't hit me yet.

我想我错过了一些明显的东西,但它还没有打到我。

Can anyone please enlighten me to whether there is a better way to do this or am I crying wolf for no reason?

任何人都可以告诉我是否有更好的方法来做到这一点,还是我无缘无故地哭狼?

EDIT: Bonus Round

编辑:奖金回合

Very good answers have been posted to this question thus far, all along the lines of CSS/JavaScript/JQuery. However could you kindly add whether or not your answer is cross browser compatible?

到目前为止,已经在这个问题上发布了非常好的答案,这些都与CSS / JavaScript / JQuery有关。但是,如果您的答案是否是跨浏览器兼容的,您还可以加入吗?

5 个解决方案

#1

The straightforward javascript is:

直截了当的javascript是:

var anchors = document.getElementsByTagName("a");
var lastAnchor = anchors[(anchors.length - 1)];

This is cross-browser compatible across all browsers all the way back to those browsers which understand only DOM Level 1 (ie. circa 2000 - Internet Explorer 5 and Netscape 6).

这是跨所有浏览器的跨浏览器兼容,一直回到那些只了解DOM Level 1(即大约2000 - Internet Explorer 5和Netscape 6)的浏览器。

#2

Why don't you try $('a:last');

你为什么不试试$('a:last');

#3

You're looking for a:last-of-type. Read more about it here: https://css-tricks.com/almanac/selectors/l/last-of-type/

你正在寻找:最后的类型。在这里阅读更多相关信息:https://css-tricks.com/almanac/selectors/l/last-of-type/

#4

I believe you want something like $("a").last()

我相信你想要的东西就像$(“a”)。last()

This will look at all anchor elements in the page and give you the very last one that is retrieved.

这将查看页面中的所有锚元素,并为您提供最后一个检索到的元素。

Using just CSS selectors is tricky, since those tend to be dependant on the DOM arrangement, and you want the selector to be DOM agnostic. For example the a:last-child selector will only return an anchor tag that is the last element in its parent. If the last anchor on a page is not the last element in its parent, using that selector may not be helpful to you.

仅使用CSS选择器是棘手的,因为那些往往依赖于DOM排列,并且您希望选择器与DOM无关。例如,a:last-child选择器只返回一个锚标记,它是父标记中的最后一个元素。如果页面上的最后一个锚点不是其父项中的最后一个元素,则使用该选择器可能对您没有帮助。

#5

Use nth-last-child(). Its pretty useful when you want the last or 2nd to last.

使用nth-last-child()。当你想要最后一个或第二个时,它非常有用。

$(this).find("a:nth-last-child(1)")

https://api.jquery.com/nth-last-child-selector/

http://jsfiddle.net/o5y9959b/

#1