jQuery.attr(“style”)vs jQuery.css()

我的同事使用此代码显示一个元素：

$('selector here').attr('style','display:inline-block');

我通常使用这个：

$('selector here').css('display','inline-block');

我知道使用style属性的内联CSS是一种不好的做法,但除此之外,这两行中的任何一行都会产生更高优先级的CSS,或者从元素的外观角度来看这两行是完全相同的吗？喜欢？

我假设.css()可能具有较低的优先级,因为内联CSS具有更高的优先级.

两者都将style属性添加到元素中.我说唯一的区别是当您一次设置多个CSS属性时代码的可读性.除此之外,css()添加了样式,只有在已经存在的情况下才会替换.通过使用attr(‘style’,…),您每次都会替换整个样式属性.

假设你有一个元素如下：
< div class ='element'style ='color：red'> test< / div>

当你使用$(‘.element’).attr(‘style’,’display：none’)时,这将导致：
< div class ='element'style ='display：none'> test< / div>

当你使用$(.element’).css(‘display’,’none’)时,这将导致：
< div class ='element'style ='color：red; display：none'> test< / div>.

使用css()还允许您设置多个样式属性,同时保持代码可读：

$('.element').css({
    color: red,
    textDecoration: 'underline',
    // etc.
})