$() 和 $ 的区别

用 $() 和 CSS 选择器创建的对象叫 jQuery Selection 或 jQuery Object ；jQuery 对象有许多方法，这些方法都在命名空间 $.fn 下：

# .remove() 方法
$( "h1" ).remove(); 

jQuery Selection

$ 命名空间下也有一些方法，叫 utility-type methods ；
$ 和 $() 的区别相当于全局和局部的区别；

jQuery 与其他 JavaScript 库冲突

jQuery 默认有一个别名 $ , 可能会和其他库的 $ 变量名冲突：在 prototype.js 中，$ 相当于 document.getElementById()

jQuery $ 覆盖其他库的 $

• 用 jQuery.noConflict() 创建新的别名，将 $ 保留给其他 库 使用

<!-- Putting jQuery into no-conflict mode. -->
<script src="prototype.js"></script> 
<script src="jquery.js"></script>  <!-- jQuery 的 $ 变量名覆盖了 prototype 的 $ 变量名 -->
<script>
 
var $j = jQuery.noConflict();
// 为 jQuery 创建新的别名 $j, 将 $ 保留给 prototype
// $j is now an alias to the jQuery function; creating the new alias is optional.
 
$j(document).ready(function() {
    $j( "div" ).hide();  /* jQuery */
});
 
// The $ variable now has the prototype meaning, which is a shortcut for
// document.getElementById(). mainDiv below is a DOM element, not a jQuery object.
window.onload = function() {
    var mainDiv = $( "main" );  /* prototype */
}
 
</script>

---

• 在某一函数块里面使用 jQuery, 将$ 传给 jQuery(document).ready()

<!-- Another way to put jQuery into no-conflict mode. -->
<script src="prototype.js"></script>
<script src="jquery.js"></script>  <!-- jQuery 的 $ 变量名覆盖了 prototype 的 $ 变量名 -->
<script>
 
jQuery.noConflict(); /* 将 jQuery 的变量名保留给 prototype 使用 */
 

// 将变量名 $ 传给 .ready()，在该本地范围可以用 $ 作为 jQuery 的别名
jQuery( document ).ready(function( $ ) {
    // You can use the locally-scoped $ in here as an alias to jQuery.
    $( "div" ).hide();
});
 
// 在全局区范围内， $ 属于 prototype
// The $ variable in the global scope has the prototype.js meaning.
window.onload = function(){
    var mainDiv = $( "main" );
}
 
</script>

其他库覆盖 jQuery 的 $ 变量名

如果是其他库覆盖了 jQuery 的 $ 变量名，则当要使用 jQuery 时，直接使用 jQuery()

<script src="jquery.js"></script>
<script src="prototype.js"></script>

编写 jQeury 插件的模板

<!-- Using the $ inside an immediately-invoked function expression. -->
<script src="prototype.js"></script>
<script src="jquery.js"></script>
<script>
 
jQuery.noConflict();
 
(function( $ ) {
    // Your jQuery code here, using the $
})( jQuery );
 
</script>