Question

如何在HTML中使用#id链接来更改页面链接栏而不更改页面垂直位置？

http://example.com/#link

Answer 1

#符号是一个锚点，如果存在与您的链接匹配的命名锚点，该页面将“更改垂直位置”。

如果您只想更改位置栏中的网址，而不使用HTML以外的任何内容，请尝试使用没有匹配链接的锚点：

Like this.

Answer 2

快速示例，因为我现在躺在床上，你可以有一个空的div填充内容div的html，这是一个不太时尚但很快的例子，你可以隐藏链接的div并拥有脚本循环通过div来重新显示它，当另一个被点击等等，但我现在休息。夜晚

＆＃13;

var links=document.getElementsByTagName('a');

for(var i=0;i<links.length;i++){
  links[i].addEventListener('click',clickFunc);
  
  
  }

function clickFunc(e){
    e.preventDefault();
   var thisId=this.getAttributeNode("data-id").value; 
   var inner=document.getElementById(thisId).innerHTML;
   document.getElementById('mainDiv').innerHTML=inner;
  
  }

＆＃13;

menu{position:fixed;top:0px;border:1px solid red;z-index:100;}
div{position:relative;margin-top:50px;}

＆＃13;

<menu><a href="#part1" data-id="part1">part 1</a><a href="#part2" data-id="part2">part 2</a><a href="#part3" data-id="part3">part 3</a></menu>
<div id="mainDiv"></div>
<div id="part1"  >part1<br>shona bhlian duit (happy new year in Irish) shona bhlian duit (happy new year in Irish) shona bhlian duit (happy new year in Irish) shona bhlian duit (happy new year in Irish) shona bhlian duit (happy new year in Irish) shona bhlian duit (happy new year in Irish) shona bhlian duit (happy new year in Irish) shona bhlian duit (happy new year in Irish) shona bhlian duit (happy new year in Irish) shona bhlian duit (happy new year in Irish) </div>

<div id="part2">part2<br>part2part2part2part2part2part2part2part2part2part2part2part2part2part2part2part2part2part2part2part2part2part2part2part2part2)part2part2part2part2part2part2part2part2part2part2part2part2part2part2part2part2part2part2part2part2part2part2part2part2part2)part2part2part2part2part2part2part2part2part2part2part2part2part2part2part2part2part2part2part2part2part2part2part2part2part2)</div>


<div id="part3">part3<br>part3part3part3part3part3part3part3part3part3part3part3part3part3part3part3part3part3part3part3part3part3part3part3part3part3part3partpart3part3part3part3part3part3part3part3part3part3part3part3part3part3part3part3part3part3part3part3part3part3part3part3part3part3partpart3part3part3part3part3part3part3part3part3part3part3part3part3part3part3part3part3part3part3part3part3part3part3part3part3part3partpart3part3part3part3part3part3part3part3part3part3part3part3part3part3part3part3part3part3part3part3part3part3part3part3part3part3partpart3part3part3part3part3part3part3part3part3part3part3part3part3part3part3part3part3part3part3part3part3part3part3part3part3part3part3</div>

＆＃13;

链接#id没有页面更改位置？

2 个答案: