Question

我想修复Firefox中的detail-html-element行为。

所以我自己切换open属性：

$('summary').on('click', function () {
    var details = $(this).parent();  
    $('details').prop('open', !details.attr('open'));
});

我使用prop因为open是属性而不是属性，对吧？！

无论如何，这在Firefox中不起作用，但如果我将prop更改为attr则可以使用

$('details').attr('open', !details.attr('open'));

有人可以向我解释我哪里出错了吗？日Thnx！

Answer 1

您正在使用的CSS标识属性。这就是为什么更改属性会获得css更改并设置属性不会。

我使用prop是因为open是属性而不是属性，对吧？！

嗯，它可以是，或者取决于你如何定义它。 css再次引用属性。

有several long answers解释差异以及在哪里使用。

简而言之

属性是 HTML元素上的一项设置，它将某些数据或行为归因于该元素。它主要与加载有关，帮助我们正确地呈现HTML，听到这可能是你使用prop的原因。

属性是 DOM节点的一个特征，告诉我们它是当前的foo状态。特定节点类型附加了特定属性，有些属于标准属性，有些属于浏览器设计属性。由于它是DOM的一部分，因此该属性与DOM操作，AKA Javascript保持一致。