將變數從 PHP 傳遞到 JavaScript

Subodh Poudel 2023年1月30日
PHP
  1. 使用 AJAX 將 PHP 變數傳遞給 JavaScript
  2. 使用 JavaScript 轉義 PHP 指令碼以將 PHP 變數傳遞給 JavaScript
  3. 在 JavaScript 中使用簡短的 PHP Echo 標記 <?=?> 將 PHP 變數傳遞給 JavaScript
將變數從 PHP 傳遞到 JavaScript

我們將介紹一種使用 AJAX 將 PHP 變數傳遞給 JavaScript 的方法。此方法從 PHP 伺服器請求資料並在客戶端計算機上執行。

我們還將演示另一種通過將 PHP 轉義為 JavaScript 來在 JavaScript 中傳遞 PHP 變數的方法。我們在 PHP 指令碼之後編寫 JavaScript 來轉義 PHP。

我們將向你展示另一個示例,使用 JavaScript 中的短回顯標記作為 <?=$var?> 將 PHP 變數傳遞給 JavaScript,其中 $var 是 PHP 變數。

使用 AJAX 將 PHP 變數傳遞給 JavaScript

我們可以使用 AJAX 將資料和變數從 PHP 伺服器獲取到 JavaScript。此方法具有單獨的伺服器端和客戶端指令碼。它使程式碼更清晰,並增強了程式碼的可讀性。AJAX 代表非同步 JavaScript 和 XML。它使用 XMLHttpRequest 物件從伺服器請求資料。它使用 JavaScript 和 HTML DOM 顯示資料。此過程是非同步發生的,這意味著更改發生在網頁中,而無需重新載入頁面。但是,在網路上使用 AJAX 時存在延遲,因為它會傳送 HTTP 請求。在這個方法中,我們在 PHP 檔案中編寫 JavaScript 程式碼。

例如,建立一個名為 index.php 的 PHP 檔案。在 <script> 標籤內編寫 JavaScript 程式碼。使用 var 關鍵字建立一個可變的 req。建立 XMLHttpRequest() 函式的請求物件並將其分配給 req 變數。使用函式表示式呼叫帶有 req 物件的 onload() 函式。在函式內部,使用 console.log() 函式記錄 this.responseText 屬性。不要忘記以分號結束函式表示式。使用 req 物件呼叫 open() 函式。同時提供 getget-data.phptrue 作為函式中的引數。使用 req 物件呼叫 send() 函式。建立另一個名為 get-data.php 的 PHP 檔案。將 Mountain 的值分配給 $var 變數。以 $var 作為引數回顯 json_encode() 函式。

在下面的示例中,我們使用 XMLHttpRequest() 函式建立了一個請求物件。onload() 函式處理響應期間要執行的操作。open() 函式指定 HTTP 方法、傳送 JSON 響應的 PHP 檔案以及控制指令碼其餘部分執行的布林值。get-data.php 檔案中的 json_encode() 函式以 JSON 格式傳送響應。在這裡,我們在控制檯中列印了變數 $var

示例程式碼:

# php 7.*
<?php
?>
<script>
var req = new XMLHttpRequest(); 
    req.onload = function() {
    console.log(this.responseText); 
 };
req.open("get", "get-data.php", true); 
req.send();
</script>
# php 7.*
<?php
$var = "Mountain";
echo json_encode($var); 
?>

輸出:

"Mountain"

使用 JavaScript 轉義 PHP 指令碼以將 PHP 變數傳遞給 JavaScript

我們可以在 PHP 標籤之後使用 JavaScript 來轉義 PHP 指令碼。我們可以在 PHP 指令碼中建立一個 PHP 變數。然後,我們可以編寫 JavaScript 來轉義上面編寫的 PHP 並將變數傳遞到 JavaScript 程式碼中。在 JavaScript 中,我們可以使用 PHP 標記來回顯 PHP 變數並將其分配給 JavaScript 變數。

例如,將值 Metallica 分配給 PHP 標籤內的變數 $var。編寫一個 script 標籤,並在其中編寫一個 PHP 標籤。在 PHP 標記內,回顯 JavaScript 變數 jsvar。將 PHP 變數 $var 分配給 jsvar。不要忘記用引號括起來的 $var 和後面的分號。關閉 PHP 標記並使用 console.log() 函式記錄 jsvar 的值。關閉 script 標籤。在下面的示例中,我們使用 JavaScript 在控制檯中記錄了 PHP 變數 $var。我們可以在網頁的控制檯中看到輸出。

示例程式碼:

#php 7.x
<?php
$var = 'Metallica';
?>
<script>
   <?php
       echo "var jsvar ='$var';";
   ?>
   console.log(jsvar); 
</script>

輸出:

Metallica

在 JavaScript 中使用簡短的 PHP Echo 標記 <?=?> 將 PHP 變數傳遞給 JavaScript

我們可以在 JavaScript 中使用簡短的 PHP echo 標記將 PHP 變數傳遞給 JavaScript。我們可以使用簡短的 PHP echo 標記來擺脫編寫 PHP 標記和 echo 語句的麻煩。這是一種速記方法。這種方法在概念和執行上與第二種方法非常相似。

例如,將值 Megadeth 分配給 PHP 標籤內的變數 $var。開啟 script 標籤並建立一個 JavaScript 變數 jsvar。寫回聲標籤 <?=$var?> 作為 jsvar 變數的值。使用 console.log() 函式記錄變數。我們可以在網頁的控制檯中檢視指令碼的輸出。

程式碼示例:

#php 7.x
<?php
$var = 'Megadeth';
?>
<script>
    var jsvar = '<?=$var?>';
    console.log(jsvar); 
</script>
?>

輸出:

Megadeth
作者: Subodh Poudel
Subodh Poudel avatar Subodh Poudel avatar

Subodh is a proactive software engineer, specialized in fintech industry and a writer who loves to express his software development learnings and set of skills through blogs and articles.

LinkedIn