【问题标题】：$(this).prop('property') vs. this.property$(this).prop('property') 与 this.property
【发布时间】：2015-04-10 13:53:05
【问题描述】：

鉴于 jQuery 的少写，多做的理念，当我看到这个时，我总是感到惊讶：

$(this).prop('checked')

… 而不是这个：

this.checked

查看最新的jQuery源码，prop()为这两个陷阱提供了便利：

它还将tabIndex 标准化为：

prop() 对于一次设置多个元素的属性以及在单个元素上链接属性当然很有用。

但是使用prop() 设置或检索单个元素上的单个属性是否有任何优势（惯用除外），除非在规范化tabIndex 时——特别是当您引用该元素时（例如@987654332 @ 在回调中）？

【问题讨论】：

不，没有优势。当你拥有的 only 东西已经是一个 jQuery 对象时，这很方便，但是创建一个新的 jQuery 对象只是为了调用 .prop() 是愚蠢的。
@px5x2 — 根据此示例从其中读取值时不是。
我喜欢这个线程 - 不确定它是否需要答案，但您说明了我只使用 5% 的 jQuery 库的众多原因之一，就像我 5 年前所做的那样。 vanilla 方法甚至对基本的 js 类型都有意义，例如document.querySelector('input[type=checkbox]') 上的已选中属性会给我一个布尔值，因为它正在找到一个复选框，但 document.querySelector('div') 将是未定义的。
@RickHitchcock：有时该表单用于与其余代码保持一致，或者为了不让新手感到困惑，或者在将代码从问题复制到答案时根本没有被编辑。尽管知识更好。
jQuery 对某些属性进行了一些更正，例如src 和 href 在 IE 中，tabIndex ，...

【解决方案1】：

.prop 作为 getter 并没有真正的优势，实际上它的性能不如直接访问属性。

.prop 的真正用处在于用作 setter。

如果您阅读DOC，则有 3 种方法可以使用.prop 进行设置。

.prop(prop, value)

第一种方式对单个元素没有优势（除非可能存在兼容性问题）。

其实this.check = true;和$(this).prop('checked', true)是一样的，但是更快。

如果你有一组元素，那是有优势的。您不必手动循环所有元素，jQuery 会为您完成。

.prop({prop : value[, prop : value, ...]});

当您要更改多个属性时，第二种方法很有用。而不是列出您想要更改的每个属性：

this.prop1=true;
this.prop2=true;
this.prop3=true;
this.prop4=true;

你可以像这样传递一个对象：

$(this).prop({
    prop1 : true,
    prop2 : true,
    prop3 : true,
    prop4 : true
});

我认为第三种方式是我最喜欢的方式。使用回调函数，您可以在一组条件下单独设置每个元素。回调接收 2 个参数：索引和旧值。

使用函数的一个很好的例子是反转每个复选框的状态：

$('checkbox').prop('checked', function(_, old){
    return !old;
});

【讨论】：