不同頁面之間跳轉：
頁面1
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <title>頁面1</title> </head> <body> <a href="2.html#a1">點我</a><!--此處id要與頁面2保持一致--> </body> </html>
頁面2
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <title>頁面2</title> </head> <body> <a href="javascript:void(0)">1</a><br/> <a href="javascript:void(0)">2</a><br/> <a href="javascript:void(0)">3</a><br/> <a href="javascript:void(0)">4</a><br/> <a href="javascript:void(0)">5</a><br/> <a href="javascript:void(0)">6</a><br/> <a href="javascript:void(0)">7</a><br/> <a href="javascript:void(0)">8</a><br/> <a href="javascript:void(0)">9</a><br/> <a href="javascript:void(0)">1</a><br/> <a href="javascript:void(0)">2</a><br/> <a href="javascript:void(0)">3</a><br/> <a href="javascript:void(0)">4</a><br/> <a href="javascript:void(0)">5</a><br/> <a href="javascript:void(0)">6</a><br/> <a href="javascript:void(0)">7</a><br/> <a href="javascript:void(0)">8</a><br/> <a href="javascript:void(0)">9</a><br/> <a href="javascript:void(0)">1</a><br/> <a href="javascript:void(0)">2</a><br/> <a href="javascript:void(0)">3</a><br/> <a href="javascript:void(0)">4</a><br/> <a href="javascript:void(0)">5</a><br/> <a href="javascript:void(0)">6</a><br/> <a href="javascript:void(0)">7</a><br/> <a href="javascript:void(0)">8</a><br/> <a href="javascript:void(0)">9</a><br/> <a href="javascript:void(0)">1</a><br/> <a href="javascript:void(0)">2</a><br/> <a href="javascript:void(0)">3</a><br/> <a href="javascript:void(0)">4</a><br/> <a href="javascript:void(0)">5</a><br/> <a href="javascript:void(0)">6</a><br/> <a href="javascript:void(0)">7</a><br/> <a href="javascript:void(0)">8</a><br/> <a href="javascript:void(0)">9</a><br/> <a href="javascript:void(0)">1</a><br/> <a href="javascript:void(0)">2</a><br/> <a href="javascript:void(0)">3</a><br/> <a href="javascript:void(0)">4</a><br/> <a href="javascript:void(0)">5</a><br/> <a href="javascript:void(0)">6</a><br/> <a href="javascript:void(0)">7</a><br/> <a href="javascript:void(0)">8</a><br/> <a href="javascript:void(0)">9</a><br/> <a href="javascript:void(0)">1</a><br/> <a href="javascript:void(0)">2</a><br/> <a href="javascript:void(0)">3</a><br/> <a href="javascript:void(0)">4</a><br/> <a href="javascript:void(0)">5</a><br/> <a href="javascript:void(0)">6</a><br/> <a href="javascript:void(0)">7</a><br/> <a href="javascript:void(0)">8</a><br/> <a href="javascript:void(0)">9</a><br/> <a href="javascript:void(0)">1</a><br/> <a href="javascript:void(0)">2</a><br/> <a href="javascript:void(0)">3</a><br/> <a href="javascript:void(0)">4</a><br/> <a href="javascript:void(0)">5</a><br/> <a href="javascript:void(0)">6</a><br/> <a href="javascript:void(0)">7</a><br/> <a href="javascript:void(0)">8</a><br/> <a href="javascript:void(0)">9</a><br/> <a href="javascript:void(0)">1</a><br/> <a href="javascript:void(0)">2</a><br/> <a href="javascript:void(0)">3</a><br/> <a href="javascript:void(0)">4</a><br/> <a href="javascript:void(0)">5</a><br/> <a href="javascript:void(0)">6</a><br/> <a href="javascript:void(0)">7</a><br/> <a href="javascript:void(0)">8</a><br/> <a href="javascript:void(0)">9</a><br/> <a id="a1">跳到這里了</a><!--此處id要與頁面1保持一致--> <br/> <a href="javascript:void(0)">1</a><br/> <a href="javascript:void(0)">2</a><br/> <a href="javascript:void(0)">3</a><br/> <a href="javascript:void(0)">4</a><br/> <a href="javascript:void(0)">5</a><br/> <a href="javascript:void(0)">6</a><br/> <a href="javascript:void(0)">7</a><br/> <a href="javascript:void(0)">8</a><br/> <a href="javascript:void(0)">9</a><br/> <a href="javascript:void(0)">1</a><br/> <a href="javascript:void(0)">2</a><br/> <a href="javascript:void(0)">3</a><br/> <a href="javascript:void(0)">4</a><br/> <a href="javascript:void(0)">5</a><br/> <a href="javascript:void(0)">6</a><br/> <a href="javascript:void(0)">7</a><br/> <a href="javascript:void(0)">8</a><br/> <a href="javascript:void(0)">9</a><br/> <a href="javascript:void(0)">1</a><br/> <a href="javascript:void(0)">2</a><br/> <a href="javascript:void(0)">3</a><br/> <a href="javascript:void(0)">4</a><br/> <a href="javascript:void(0)">5</a><br/> <a href="javascript:void(0)">6</a><br/> <a href="javascript:void(0)">7</a><br/> <a href="javascript:void(0)">8</a><br/> <a href="javascript:void(0)">9</a><br/> <a href="javascript:void(0)">1</a><br/> <a href="javascript:void(0)">2</a><br/> <a href="javascript:void(0)">3</a><br/> <a href="javascript:void(0)">4</a><br/> <a href="javascript:void(0)">5</a><br/> <a href="javascript:void(0)">6</a><br/> <a href="javascript:void(0)">7</a><br/> <a href="javascript:void(0)">8</a><br/> <a href="javascript:void(0)">9</a><br/> <a href="javascript:void(0)">1</a><br/> <a href="javascript:void(0)">2</a><br/> <a href="javascript:void(0)">3</a><br/> <a href="javascript:void(0)">4</a><br/> <a href="javascript:void(0)">5</a><br/> <a href="javascript:void(0)">6</a><br/> <a href="javascript:void(0)">7</a><br/> <a href="javascript:void(0)">8</a><br/> <a href="javascript:void(0)">9</a><br/> <a href="javascript:void(0)">1</a><br/> <a href="javascript:void(0)">2</a><br/> <a href="javascript:void(0)">3</a><br/> <a href="javascript:void(0)">4</a><br/> <a href="javascript:void(0)">5</a><br/> <a href="javascript:void(0)">6</a><br/> <a href="javascript:void(0)">7</a><br/> <a href="javascript:void(0)">8</a><br/> <a href="javascript:void(0)">9</a><br/> <a href="javascript:void(0)">1</a><br/> <a href="javascript:void(0)">2</a><br/> <a href="javascript:void(0)">3</a><br/> <a href="javascript:void(0)">4</a><br/> <a href="javascript:void(0)">5</a><br/> <a href="javascript:void(0)">6</a><br/> <a href="javascript:void(0)">7</a><br/> <a href="javascript:void(0)">8</a><br/> <a href="javascript:void(0)">9</a><br/> <a href="javascript:void(0)">1</a><br/> <a href="javascript:void(0)">2</a><br/> <a href="javascript:void(0)">3</a><br/> <a href="javascript:void(0)">4</a><br/> <a href="javascript:void(0)">5</a><br/> <a href="javascript:void(0)">6</a><br/> <a href="javascript:void(0)">7</a><br/> <a href="javascript:void(0)">8</a><br/> <a href="javascript:void(0)">9</a><br/> </body> </html>
點擊頁面1的鏈接，可跳轉到頁面2的錨點處
效果圖：
同頁面跳轉：
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <title>錨點鏈接</title> <style> *{ margin: 0; padding: 0; } a{ list-style: none; text-decoration: none; } </style> </head> <body> <a href="#tiaozhuan_1">跳轉一</a> <a href="#tiaozhuan_2">跳轉二</a> <div style="width:100%; height:500px; background:#0066FF;">我是占位的塊</div> <div style="width:100%; height:450px; background:#66FFFF;"><a id="tiaozhuan_1">我是跳轉一跳到的位置</a></div> <div style="width:100%; height:450px; background:#99CC00;"><a id="tiaozhuan_2">我是跳轉二跳到的位置</a></div> <div style="width:100%; height:500px; background:#0066FF;">我是占位的塊</div> </body> </html>
說明：點擊跳轉一跳到一的位置，點擊跳轉二跳到二的位置
***************************************************************************************
<!--
location.href 用來跳轉到指定頁面或獲取當前頁面的地址
location.hash #后內容 設置或者獲取錨點鏈接(以#開頭)
search ?后的內容 給當前地址設置參數或者獲取當前地址中的參數(以？開頭)
-->