javascript - 单击超链接并更改 ID 的 CSS

Question

我觉得标题很明显。我的页面上有超链接；

<a href="#box1">LINK1</a>
<a href="#box2">LINK2</a>

<div id="box1">
content
</div>
<div id="box2">
content
</div>

box1 和 box2 没有背景，但是当我单击 link1 并转到 box1 时，有没有办法更改这个已访问框的 css？

JsFiddle 中的一个简单草稿

Answer 1

从 hash 属性中提取 id

由于哈希返回#box1，它可以用作id选择器

使用属性开始于选择器选择#box(Anything)元素

$('a[href^="#box"]').on('click', function() {
  $(this.hash).css('background', 'green');
});

div {
  width: 100%;
  height: 400px;
  border: 1px solid #ccc;
}
#c:focused {
  background #d00;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<a href="#box1">LINK1</a>
<a href="#box3">LINK2</a>
<a href="#box2">LINK3</a>

<div id="box1">
  content1
</div>
<div id="box2">
  content2
</div>
<div id="box3">
  content3
</div>