首頁 > 文章 > web前端 > javascript怎麼實現頁面跳轉

javascript怎麼實現頁面跳轉

青灯夜游原創: 2021-04-07 16:18:2756308瀏覽

js頁面跳轉法：1、使用「location.href="URL"」；2、使用「location.replace("URL")」；3、使用「location.assign("URL" )」；4、使用「window.open("URL")」。

javascript怎麼實現頁面跳轉

本教學操作環境：windows7系統、javascript1.8.5版、Dell G3電腦。

javascript實作頁面跳轉的方法：

#1、使用location.href屬性跳到其他網頁

語法：

location.href="URL";

範例：

<!DOCTYPE html>
<html>
    <head>
		<meta charset="UTF-8">
    </head> 
    <body> 
      <p>这是<i>location.href</i>方式的示例</p> 
      <button onclick="myFunc()">点击这里</button> 
        
      <!--重定向到其他网页的脚本-->   
      <script> 
         function myFunc() { 
           window.location.href="https://www.php.cn"; 
         } 
      </script> 
   </body> 
</html>

2、使用location.replace()方法跳到其他網頁

語法：

location.replace("URL");

範例：

<!DOCTYPE html>
<html>
    <head>
		<meta charset="UTF-8">
    </head> 
    <body> 
      <p>这是<i>location.replace()</i>方式的示例</p> 
      <button onclick="myFunc()">点击这里</button> 
        
      <!--重定向到其他网页的脚本-->   
      <script> 
         function myFunc() { 
          location.replace("https://www.php.cn"); 
         } 
      </script> 
   </body> 
</html>

【推薦學習：javascript進階教學】

3、使用location.assign ()方法跳到其他網頁

語法：

location.assign("URL")

範例：

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
    </head> 
    <body> 
      <p>这是<i>location.assign()</i>方式的示例</p> 
      <button onclick="myFunc()">点击这里</button> 
        
      <!--重定向到其他网页的脚本-->   
      <script> 
         function myFunc() { 
          location.assign("https://www.php.cn"); 
         } 
      </script> 
   </body> 
</html>

4、使用window.open()方法跳到其他網頁

語法：

window.open("URL");

範例：

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
    </head> 
    <body> 
      <p>这是<i>window.open()</i>方式的示例</p> 
      <button onclick="myFunc()">点击这里</button> 
        
      <!--重定向到其他网页的脚本-->   
      <script> 
         function myFunc() { 
          window.open("https://www.php.cn"); 
         } 
      </script> 
   </body> 
</html>

更多程式相關知識，請造訪：程式設計影片！！

以上是javascript怎麼實現頁面跳轉的詳細內容。更多資訊請關注PHP中文網其他相關文章！

JavaScript JS location href

陳述：

本文內容由網友自願投稿，版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容，請聯絡admin@php.cn

上一篇：如何在JS中改變DOM元素的文字內容下一篇：如何在JS中改變DOM元素的文字內容

看更多