当由锚点URL访问时，Hightlight锚点ID [英] Hightlight Anchor ID when visited by an Anchor URL

问题描述

有人提到这在CSS中是可能的，所以我查了一下，这正是我所需要的！

CSS

您需要使用:target伪类:

:target {
   background-color: #ffa;
}

JS小提琴演示.

感谢David Thomas 来源

---

还要感谢您的代码，也是我需要的

---

一段时间以来，我一直在试图解决这个问题.

当有人通过以下URL访问我的页面时:

http://jsfiddle.net/maNR5/show/#second

我希望第二个id的标题元素以背景色突出显示.

<div>

    <h1><a id="first">How can I...</a></h1>    

    <h1><a id="second">...make this...</a></h1>

    <h1><a id="turd">Highlighted when....</a></h1>    

    <h1><a id="furd">Visited by an...</a></h1> 

    <h1><a id="earth">Anchor URL</a></h1>


</div>

这在javascript中可行吗?感谢您的提示.

解决方案

尝试一下:

 var id=window.location.href.substring(window.location.href.lastIndexOf('/') + 1);
 $(id).css('background-color','red');

EDIT:

Someone mentioned this was possible in CSS so I looked it up and that is exactly what I needed!

CSS

You need to use the :target pseudo-class:

:target {
   background-color: #ffa;
}

JS Fiddle demo.

Thanks David Thomas source

---

ALSO THANKS MILIND YOUR CODE IS ALSO WHAT I NEEDED

---

I've been trying to figure this out for a while.

When someone visits my page trough an URL like this:

http://jsfiddle.net/maNR5/show/#second

I want the header element with id second to be highlighted with a background color.

<div>

    <h1><a id="first">How can I...</a></h1>    

    <h1><a id="second">...make this...</a></h1>

    <h1><a id="turd">Highlighted when....</a></h1>    

    <h1><a id="furd">Visited by an...</a></h1> 

    <h1><a id="earth">Anchor URL</a></h1>


</div>

Is this possible in javascript? Thanks for any tips.

解决方案

Try this:

 var id=window.location.href.substring(window.location.href.lastIndexOf('/') + 1);
 $(id).css('background-color','red');

这篇关于当由锚点URL访问时，Hightlight锚点ID的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！