在自定义主题中调用wp_enQueue_脚本来加载脚本和样式之间的区别

时间:2017-04-07 作者:Shyamali

我是WordPress的新手。我已经开始创建自己的自定义主题。当我创建它时,我发现add_action(\'wp_enqueue_script\', \'custom_script\'); 也可用于添加样式。

谁能解释一下wp_enqueue_stylewp_enqueue_script 加载样式和脚本?

1 个回复
最合适的回答,由SO网友:Fayaz 整理而成

wp_enqueue_scripts 操作挂钩:WordPress提供了各种名称(或占位符),可用于注入callback functions 在WordPress core的执行生命周期内。这些被称为actionfilter hooks.

wp_enqueue_scripts 是WordPress操作挂钩。

Note: 不是的wp_enqueue_script, 复数形式:wp_enqueue_scripts.

通过这个钩子,我们可以在WP核心执行的正确时间添加脚本或样式。它本身没有添加任何样式或脚本,只是插入了我们的自定义回调函数,以便WordPress可以在正确的时间执行它。因此,代码如下所示:

function custom_script_style_adding_function() {
    // CODE for adding styles / scripts
}
add_action( \'wp_enqueue_scripts\', \'custom_script_style_adding_function\' ); 
用于排队脚本的函数(&H);样式:

因为通常我们在HTML中添加脚本和样式<head> 标签WordPress doesn\'t need separate action hooks 但是,要定义何时添加它们,因为脚本和样式具有不同的HTML语法,WordPress needs separate functions 将它们添加到HTML代码中。对于脚本,函数为wp_enqueue_script() 对于样式,函数是wp_enqueue_style() (注意使用singular 这些函数名称中的单词)。

因此,当我们使用这些函数添加脚本和样式时,最终的代码如下所示:

function custom_script_style_adding_function() {
    wp_enqueue_script( \'my-js\', get_stylesheet_directory_uri() . \'/script.js\' );
    wp_enqueue_style( \'my-css\', get_stylesheet_directory_uri() . \'/style.css\' ); 
}
add_action( \'wp_enqueue_scripts\', \'custom_script_style_adding_function\' ); 
将脚本排队(&H);单独函数中的样式:任何挂钩都可以用于附加多个回调函数。所以我们可以使用wp_enqueue_scripts 动作挂钩,用于附加不同的自定义函数以添加脚本和样式,如下所示:

// this function only adds scripts
function custom_script_adding_function() {
    wp_enqueue_script( \'my-js\', get_stylesheet_directory_uri() . \'/script.js\' );
}
add_action( \'wp_enqueue_scripts\', \'custom_script_adding_function\' );

// this function only adds styles
function custom_style_adding_function() {
    wp_enqueue_style( \'my-css\', get_stylesheet_directory_uri() . \'/style.css\' ); 
}
add_action( \'wp_enqueue_scripts\', \'custom_style_adding_function\' );
这本质上是相同的,唯一的区别是,这里我们使用单独的自定义函数来添加脚本和样式。因此,除了分离样式和脚本的代码之外,这种方法与上面的另一种方法没有太大区别。

进一步阅读:

还有其他脚本(&H);WordPress中对不同场景有用的样式相关函数。例如,检查Related functions in the codex 了解WordPress中脚本和样式的其他类似功能。这developer doc. 还有一些有用的信息。

相关推荐