Question

我目前有一个包含这样div的html文件：

＆＃13;

div.myClass:visited {
  background-color: red;
 }

＆＃13;

<div class="myClass" href="link">
</div>

＆＃13;

我在这里要做的是将div直接指向给定的链接，如果已经访问了链接，则div background-color会变为红色。链接工作正常，但访问链接时更改背景颜色不起作用。有没有办法更改包含访问链接的div的背景颜色？谢谢！

Answer 1

使用Javascript替换innerHTML

<script type = "text/javascript">
    function ReplaceContentInContainer(id, content) {
    var container = document.getElementById(id);
    container.innerHTML = content;
} </script>

<div id="example1div" style="border-style:solid;padding:10px; text-align:center;">
I will be replaced when you click.
</div>
<a href="javascript:ReplaceContentInContainer('example1div','Whew! You clicked!')">Click me to replace the content in the container.</a>

Answer 2

使用<a/>代替div，并将div设为display:block;，width和height

例如：

<a class="myClass" href="http://www.lego.com/en-us/"></a>

CSS：

 .myClass {
     background-color: blue;
     width:200px;
     height:200px;
     display:block;
 }

.myClass:visited {
     background-color: red;
 }

.myClass:hover{
     background-color: green;
}

View on CodePin

另见：

How can I detect visited and unvisited links on a page?

Privacy and the :visited selector

访问href链接时更改div样式

2 个答案:

View on CodePin