Javascript 突出显示元素的脚本<；部门>；在上标href上单击？_Javascript_Html_Css

Javascript 突出显示元素的脚本<；部门>；在上标href上单击？

javascript html css

Javascript 突出显示元素的脚本<；部门>；在上标href上单击？,javascript,html,css,Javascript,Html,Css,为了简化起见，假设我有以下基本页面结构： <head> <script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <script src="scripts/scroll.js"></script> <script src="scripts/highlight.js"></script> <

为了简化起见，假设我有以下基本页面结构：

<head>
  <script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
  <script src="scripts/scroll.js"></script>
  <script src="scripts/highlight.js"></script>
</head>

<body>

<div id="container">
  <div id="descriptions">
    <p>
      Description 1 Content<sup><a href="#ref1"> 1</a></sup>
    </p>
    <p>
      Description 2 Content<sup><a href="#ref2"> 2</a></sup>
    </p>
    <p>
      Description 3 Content<sup><a href="#ref3"> 3</a></sup>
    </p>
    ...
    ...
    ...
    <p>
      Description 10 Content<sup><a href="#ref10"> 10</a></sup>
    </p>
    <p>
      Description 11 Content<sup><a href="#ref11"> 11</a></sup>
    </p>
  </div>

  <div id="references">
    <div id="ref1">
      Reference 1 Content
    </div>
    <div id="ref2">
      Reference 2 Content
    </div>
    <div id="ref3">
      Reference 3 Content
    </div>
    ...
    ...
    ...
    <div id="ref10">
      Reference 10 Content
    </div>
    <div id="ref11">
      Reference 11 Content
    </div>
  </div>
</div>

</body>

它以某种方式覆盖了CSS高亮显示。甚至添加！对CSS来说很重要，但没有帮助。滚动效果很好，只是高亮显示消失了

你知道我做错了什么吗

编辑：以下是我以前的语法：

<div id="references">
    <p id="ref1">
      Reference 1 Content
    </p>
    <p id="ref2">
      Reference 2 Content
    </p>
    <p id="ref3">
      Reference 3 Content
    </p>
    ...
    ...
    ...
    <p id="ref10">
      Reference 10 Content
    </p>
    <p id="ref11">
      Reference 11 Content
    </p>
  </div>

无论如何，在实现上述javascript后，突出显示停止工作。

您能给我们展示css突出显示语法吗？@LcSalazar编辑了OP。滚动脚本中有什么？它是否将自己的css属性添加到div中？这可能会覆盖您的css属性。@poodle我的滚动脚本在我的编辑之上。也可以在这里找到：

<div id="references">
    <p id="ref1">
      Reference 1 Content
    </p>
    <p id="ref2">
      Reference 2 Content
    </p>
    <p id="ref3">
      Reference 3 Content
    </p>
    ...
    ...
    ...
    <p id="ref10">
      Reference 10 Content
    </p>
    <p id="ref11">
      Reference 11 Content
    </p>
  </div>

div.references p:target {
    background-color: #FDD;
}