jQuery attr方法可以设置单击处理程序和内部文本

Question

阅读jQueryUI对话框代码,我发现,jQuery .attr()方法有一些未记录的行为:

<button id="btn1">1</button>
<button id="btn2">2</button>

$(function() {
    var props = {
        text: 'Click it!',
        click: function () {
            console.log('Clicked btn:', this);
        }
    };

    $('#btn1').attr(props, true);    // Changes #btn1 inner text to 'Click it!' 
                                     // and adds click handler
    $('#btn2').attr(props);          // Leaves #btn2 inner text as it is and fires 
                                     // click function on document ready
});

• 你能解释一下它是如何工作的吗？为什么我应该true在属性 - 值对映射后设置为第二个参数？
• 我可以安全地在我的项目中使用此功能吗？

Answer 1

我在这里稍微猜测一下，因为我不熟悉 jQuery 源代码。jQuery.attr调用jQuery.access，并且 jQuery.access 函数上方的注释如下：

// Multifunctional method to get and set values of a collection
// The value/s can optionally be executed if it's a function

经过进一步调查，该text()函数还调用jQuery.access：

    attr: function( name, value ) {
        return jQuery.access( this, jQuery.attr, name, value, arguments.length > 1 );
    },
    .........
    text: function( value ) {
        return jQuery.access( this, function( value ) {
        ......
    },

您使用 attr 来设置文本和事件处理程序，这不是 attr 的用途。然而，它们似乎都使用相同的函数来完成工作，因此使用未记录的参数只是偶然地为您提供了预期的行为。

我认为依靠未记录的行为来完成您在这里尝试做的事情是不可靠的，因为 jQuery 的任何未来升级都可能会破坏您的代码。