Why do I need jquery.min.js vs just jquery.js for script to work?
Question
I'm new to Wordpress and this has been bugging me for a while. I'm wondering why the code I'm trying to include only works when I include jquery.min.js in 'head' despite the child theme already including jquery.js by default. Let me explain below.
I have a script near the end of my 'body' to specify images in galleries to not have a 'pin it' button show up when hovering over them:
<script type="text/javascript">
$(document).ready(function() {
$(".tiled-gallery-item a img").attr("nopin","nopin");
});
</script>
This code only works (ie., the nopin attribute is added to the relevant img tags) when I include this in the 'head':
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js" type="text/javascript" /></script>
However, it appears from inspecting source that the child theme already includes jquery.js:
<script type="text/javascript" src="http://blog.froy.com/wp-includes/js/jquery/jquery.js?ver=1.10.2"></script>
<script type="text/javascript" src="http://blog.froy.com/wp-includes/js/jquery/jquery-migrate.min.js?ver=1.2.1"></script>
Why the heck is the jquery.min.js necessary? I'm new to Wordpress and it's so confusing. I thought the jquery.min.js and jquery.js has no functional difference. What is the jquery-migrate.min.js?
2 answers
solution1
3 ACCPTED 2014-02-22 08:31:07
WordPress comes with built-in jQuery but doesn't load it by default. it's probably because your theme has been applied wp_enqueue_script('jquery'); inside functions.php
One solution for you to replace this default behavior is to add this snippet to your functions.php :
function modify_jquery() {
if (!is_admin()) {
wp_deregister_script('jquery');
wp_register_script('jquery', 'http://ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js', false, '1.8.1');
wp_enqueue_script('jquery');
}
}
add_action('init', 'modify_jquery');
Also, because you're using use jQuery version 1.10.2 , jQuery migrate used here to detect and restore APIs or features that have been deprecated and removed as of version 1.9.
solution2
1 2014-02-22 09:16:47
Felix provided exactly what was needed. To fully answer my question for future visitors, let me explain in specifics.
Basically, Wordpress includes the jQuery library by default regardless of your theme (I personally use the Genesis framework with a child theme). In addition, Wordpress, by default, sets the library to noConflict() mode. This is to prevent compatibility problems with other JavaScript libraries that WordPress can link.
If you want to include any scripts that require jquery, you need to use the wp_enqueue_script() .
Now this was the important part. If you don't want to go through the troubles and want to include a simple, quick, script at the end of your <body> or elsewhere without having to go into functions.php and using enqueue, replace the $() shortcut with jQuery() .
In my case,
<script type="text/javascript">
$(document).ready(function() {
$(".tiled-gallery-item a img").attr("nopin","nopin");
});
</script>
needed to be...
<script type="text/javascript">
jQuery(document).ready(function(){
jQuery(".tiled-gallery-item a img").attr("nopin","nopin");
});
</script>
That's it! I was able to remove the redundant jquery.min.js and simply rely on Wordpress' default jQuery library.
I figured this out by reading this and this . You can find more details in those links.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.