无法使用Enqueue调用Javascript

Question

我正在使用子主题，并试图从/ child主题/ JS /custom.js调用自定义js。

在我的函数文件中有：

function myprefix_enqueue_scripts() {
    wp_enqueue_script( 'my-script', get_stylesheet_directory_uri() . '/js/custom.js', array(), true );
}
add_action( 'wp_enqueue_scripts', 'myprefix_enqueue_scripts' );

在Javascript中我有：

$( document ).ready(function() {
    alert( "Here's your javascript!" );
});

var textID = document.getElementById("logo.no-image"); // go and take the Text from the ID
var text = textID.innerHTML; // Take the text from the
var toChange = text.split(""); // Separrate each letter into array
var newText = ""; // buffer text
var aClassName = ["red", "green", "blue"]; // class name that you want
var colorNumber = 0; // counter to loop into your class

for (var i=0, ii=toChange.length; i"+toChange[i]+"<\/span>";
    colorNumber++
}
// Output your text into the web
textID.innerHTML = newText;

我包括了测试脚本是否正在加载的警报。

Answer 1

在WP中，默认情况下，jQuery在兼容性模式下工作。这意味着jQuery的典型$快捷方式不起作用，因此它不会与使用美元符号的任何其他JavaScript库冲突，比如MooTools或Prototype。

因此，您应该在JS文件中使用jQuery而不是$。

当然，您可以将代码包装在匿名函数中，在其中传入jQuery以映射到$。

(function($) {

    // $ Works here!
    // console.log($);

})( jQuery );

在对脚本进行排队时，还必须将jquery添加为依赖项：

function myprefix_enqueue_scripts() {
    wp_enqueue_script( 'my-script', get_stylesheet_directory_uri() . '/js/custom.js', array('jquery'), true );
}
add_action( 'wp_enqueue_scripts', 'myprefix_enqueue_scripts' );

PS。我假设您的文件已正确地排队，并且它确实在您的代码中。