在 WordPress 的开发中,我们通常需要使用 JavaScript 来操作 DOM 或者发送 Ajax 请求等。然而,在 JS 脚本文件中经常需要引入其他资源或者与服务器交互,这就需要我们准确配置文件路径。本文将介绍如何在 WordPress 中使用正确的路径 URL。
WordPress 的路径 URL
在 WordPress 中,路径 URL 主要有两种类型:网站根目录 URL 和主题目录 URL。
- 网站根目录 URL 是指安装 WordPress 的根目录 URL。例如:
http://example.com
。 - 主题目录 URL 是指正在使用的主题的目录 URL。例如:
http://example.com/wp-content/themes/mytheme/
。
在 JS 文件中使用路径 URL
在 JS 文件中,我们可以通过以下方式来获取路径 URL:
-- ------- --- ----- ------- - ----------------------- -- ------ --- ----- -------- - ----------------
其中,window.themeUrl
需要在后台 PHP 文件中定义并传递给前端。
--- - ------------ --- ---- -- -------- -------------------- - ------------------ --------------- ---------------------------- - ---------------- -------- -------- ---- -- --------- - - ---------- -- ---------------------------- -- ------------------- --------------- ----------- --------- -- - ----------- --------------------- -------------------- --
使用 wp_localize_script()
函数,我们将 $themeUrl
数组传递到前端,并定义为 themeUrl
变量。在 JS 文件中就可以通过 window.themeUrl
来获取主题目录 URL。
示例代码
下面是一个使用 jQuery 发送 Ajax 请求的例子:
---------------------------------- - -- ------ -------- ---- -------- - ------------------------- ----- ------ ----- - -------- --- -- --------- ------- -------- -------------- - ------------------ -- ------ ------------- ------------ ------------ - --------------------------- - --- ---
在上述代码中,我们通过 themeUrl
变量来构造完整的请求路径 URL。然后通过 jQuery 的 $.ajax()
方法发送 Ajax 请求,并在返回成功或失败时分别输出结果或错误信息。
总结
在 WordPress 开发中,正确配置路径 URL 是非常重要的。本文介绍了如何在 JS 脚本文件中获取网站根目录 URL 和主题目录 URL,并给出了一个使用 jQuery 发送 Ajax 请求的示例代码。希望能帮助读者理解和掌握相关知识。
来源:JavaScript中文网 ,转载请注明来源 本文地址:https://www.javascriptcn.com/post/26371