WordPress網站添加Javascript代碼的方法

這篇文章給大家介紹的內容是關於WordPress網站添加Javascript代碼的方法，有著一定的參考價值，有需要的朋友可以參考一下。

如果是修改自己製作的模板主題，升級和更新自己掌控，javascript代碼的添加比較自由，可根據實際商務邏輯引入即可。但是如果想添加與主題無關的javascript代碼，例如訪客統計，效能監控等類型的獨立代碼，由於與主題檔案沒有關係，那麼最好的辦法就是在外掛程式中添加代碼。

WordPress提供了函數 wp_enqueue_script 和鉤子 wp_enqueue_scripts

以方便開發人員有能力嵌入自訂的代碼。

下面簡述添加的方法步驟：

在外掛程式目錄下建立一個目錄，進入目錄後建立一個外掛程式檔案index.php，插入如下範例程式碼：

<?php/*Plugin Name: custom javascriptDescription: Add custom javascript*/function add_custom_scripts() {     wp_enqueue_script( 'jquery-ui', 'https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js', array(), '1.12.1', false);}add_action( 'wp_enqueue_scripts', 'add_custom_scripts' );

wp_enqueue_script 函數五個參數說明

1. string $handle #對當前引入的javascript檔案的唯一命名

2. string $src = '' #javascript文檔資源url

3. array $deps = array() #依賴代碼handle

4. string|bool|null $ver = false #版本號碼，如果未指定，與WordPress系統版本號碼一致

5. bool $in_footer = false #是否在文檔底部，如果是false，則預設在文檔頭部就載入javascript

最後儲存檔案，去外掛程式中心啟用外掛程式，在瀏覽器頁面查看頁面原始碼，就可以看到引入的 javascript 檔案了。

使用 wp_enqueue_script 函數有以下優點：

a. 可以設定與其他依賴代碼的載入次序

b. 可以指定版本號碼利於緩衝管理

c. 可以指定內嵌程式碼在文檔的位置