jQuery和$问题

2018-06-18 07:44:08

我正在修改一些有很多jQuery的代码，但我不确定一些jQuery语句正在做什么。

在jQuery代码的顶部有

jQuery.noConflict

* 1。我明白那个。但是，有一些代码具有：

<script type="text/javascript">
(function($) {

$(document).ready(function() {

    jQuery.fn.fixEmail = function() {
    {
   return $(this).each(function() {
       var $s = $(this);                  
           ...code...
        }
}
</script>

由于noConflict，我使用jQuery。什么是参数$？

* 2。在另一个功能中，他们使用

<script type="text/javascript">
jQuery(function(){
    var $ = jQuery;
    var cc = {
        mode : 'teaser',
        featureVisible : true,
        $loader : '<p class="loadingAnimation"><img height="32" src="' +
                config.xoImgUrl +
                '/images/ajax-loader.gif" width="32" /></p>',
                ....more code...
            }
}
</script>

所以他们从noConflict中将$设置为jQuery。但为什么？他们可以只使用jQuery吗？

* 3。有一个我想要使用的插件是通过以下方式初始化的：

   var $j = jQuery.noConflict();
    var $ = {};
    $j(document).ready(function(){
        $j.history.init(pageload);
        $j("a[@rel='history']").click(function(){
            ...more code...
        });
    });

我了解noConflict的作用，但是var $ = {}做了什么？

例1：

我想你错过了一些代码：

(function($) {

$(document).ready(function() {

    jQuery.fn.fixEmail = function() {
    {
   return $(this).each(function() {
       var $s = $(this);                  
           ...code...
        }
}
)(jQuery); //This line was missing in your code.

让我们稍微重写一下这段代码，以了解发生了什么。

function complicatedFunction($) {
          // the document.ready call goes here.
}

接下来，你将如何调用这个函数？

complicatedFunction(someObject);

所以里面的complicatedFunction $指someObject。 同意？

如果你写

complicatedFunction(jQuery);

然后在函数内部， $引用jQuery对象。因此，里面的所有东西，complexFunction都可以像'普通jQuery用户'那样使用'$'。

回到原来的代码，如果我们决定不命名这个函数，即使它匿名，你可以直观地看到代码，

(function($) { })(jQuery);

您正在创建一个名为$的参数的匿名函数。您立即调用这个匿名函数将jQuery对象传递给它。这样，您不必修改全局$对象，但匿名函数中的所有代码都可以像$始终可用那样工作。很酷，不是吗？ :)

例2：

jQuery(function(){
        var $ = jQuery;
        var cc = {
                mode : 'teaser',
                featureVisible : true,
                $loader : '<p class="loadingAnimation"><img height="32" src="' +
                                config.xoImgUrl +
                                '/images/ajax-loader.gif" width="32" /></p>',
                ....more code...
            }
});

与示例1类似，我还没有看到这种编码风格。（我甚至不确定这是否可行）

无论如何，在传递给jQuery的匿名函数中，您可以本地化$的使用而不影响其他代码。是的，他们可以在任何地方简单地使用jQuery对象，但这会非常冗长，不是吗？

例3：

var $ = {};

上面的行定义了一个空对象并将其分配给变量$。

和做一样，

var $ = new Object();

这与您如何使用两种不同的语法定义数组类似。

var items = [];  //same as var items = new Array();

有点历史

记住，'$'没有什么特别的特殊之处。这是一个变量名称，就像任何其他名称一样。在早些时候，人们习惯使用document.getElementById编写代码。由于JavaScript区分大小写，因此在编写document.getElementById时出错是正常的。我应该资本''的'B'吗？我是否应该注册Id的“我”？你得到了漂移。因为函数是JavaScript中的第一类公民，所以你可以随时做到这一点

var $ = document.getElementById; //免受document.getElementById的限制！

当Prototype库到达时，他们将其获取DOM元素的函数命名为'$'。几乎所有的JavaScript库都复制了这个想法。 Prototype还引入了$$函数来选择使用CSS选择器的元素。

jQuery也调整了$函数，但扩展了它使其接受所有类型的“选择器”来获得你想要的元素。现在，如果你已经在你的项目中使用了Prototype并且想要包含jQuery，那么你会遇到问题，因为'$'可能指向Prototype的实现或者jQuery的实现。这就是为什么jQuery有noConflict选项的原因，以便您可以在使用Prototype的项目中包含jQuery，并慢慢迁移您的代码。我认为这对约翰来说是一个很棒的举动！ :)

1

您在代码片段末尾是否缺少一些代码？通常这个惯例是这样做的：

jQuery.noConflict();

(function($){

$(document).ready(function() {

    jQuery.fn.fixEmail = function() {
    {
   return $(this).each(function() {
       var $s = $(this);                  
           ...code...
        }
}

})(jQuery);

注意底层，jQuery作为参数传递给函数表达式，所以$等于jQuery，但只在该函数表达式中。

2

他们本可以使用jQuery，但他们可能依赖于使用$的复制/粘贴代码。

3

我可能会重构这些使用与我在＃1中提到的约定相似的约定。我不知道他们为什么设定$等于一个对象，但它有一个难闻的气味。

这个代码有一个臭味。他们是否使用其他JavaScript库？

$通常是JQuery函数，但我相信Prototype也使用它。这可能是原型代码？ 2：你是对的。至少我不能想到一个理由。 3：将{}重置为新对象。基本上取消了JQuery

链接地址: http://www.djcxy.com/p/51691.html

上一篇: jQuery and $ questions

下一篇: Is there a Java equivalent to Javascript's with statement?