Wordpress用get_current_screen函数来选择性加载插件中的JS和CSS

很多人都说过，“一个良好的 WordPress 使用者只加载他们需要的文件。” 这个原则既适用于前端，也适用于后端。当你只是想 CSS 和 JS 出现在你所创建的那个页面，就没有必要在后台也加载了。

“绝对不要在所有的管理界面上都允许 CSS 和 JS 文件，这会引起与其他插件的冲突。”

几乎所有的管理员页面都有一个唯一的 URL，所以要做到在需要的页面上加载 JS 和 CSS 文件并不难。可以使用 <code>$_SERVER['REQUEST_URI']</code> 或者是 <code>$_GET['action']</code> 参数。其实还有一种更快捷，简单而又标准化的方式来实现这个目的。那就是 <code>get_current_screen</code> 函数。

是在 WordPress 3.1 引入的，所以如果你在更旧版本上使用，会返回 <code>call to undefined function</code> 错误。如果不确定，可以用 <code>function_exists</code> 函数来检查一下是否可用。

在 <code>admin_init</code> 和 <code>init</code> 挂钩上不可用。因为这是在那些挂钩请求之后才会初始化的。

在后端不可用。

我们假设你的插件在设置菜单下有一个选项页面你是用下面这行代码写的：

此时，你需要添加额外的 CSS 和 JavaScript 到这个页面，代码如下：

<a></a>

上面是个很糟糕的方案，不要那样做。上面一段代码会让包含 CSS 和 JS 的 Farbtastic 颜色选择器出现在管理员界面的每一页。如果别的插件不需要你的 CSS 和 JS， 他们就必须用 <code>wp_dequeue_*</code> 函数来移除。这很没有必要而且很鲁莽，因为这是可以有更好的代码的。代码如下：

<a href="http://ki.ki.ki/files/2012/07/18/69421f032498c97020180038fddb8e24.code.png"></a>

如果你看到上图我们写的改进的代码，你会发现只加了一个 <code>if</code> 语句以及一个简单的函数 <code>is_my_plugin_screen</code>（这是用来确认是否打开的是插件选项页面）。控制 <code>WP_Screen</code> 的变量 <code>$screen</code> 有很多属性值，但是我们感兴趣的就只有 id 。这个 id 有一个 前缀 <code>settings_page_</code>，该前缀在所有的设置页面都是一样的。而字符串 <code>my_plugin</code> 是唯一的，因为我们在调用 <code>add_options_page</code> 函数的时候把它定位为第四个参数了。

代码很简单而且在所有的管理员界面都适用。可以很方便的看见转存到 <code>$screen</code> 的 id 是什么

1、不要在所有的管理页面上都加载 CSS 或 JS 文件。这会引起与其他插件的冲突。

2、在 <code>init</code> 函数之后使用 <code>get_current_screen</code> 来识别你的管理界面什么时候是可见的，可见的时候加载额外的东西。

4、不要引用 <code>&lt;script&gt;</code> 或者 <code>&lt;style&gt;</code> 标签；要用 <code>wp_enqueue_*</code> 函数。

本文转自黄聪博客园博客，原文链接：http://www.cnblogs.com/huangcong/archive/2013/03/23/2977349.html，如需转载请自行联系原作者