hasAttribute对hasOwnProperty

Question

我遇到了一些jquery代码，它试图使用hasOwnProperty访问html属性。

<input type="text" name="fname" placeholder="First name">

<script>
    var e = $element.find('input')[0];
    if(!e.hasOwnProperty("placeholder")){...}
</script>

据我所知，这应该永远是

if(!e.hasAttribute("placeholder")){...}

但是hasAttribute和hasOwnProperty之间有什么区别呢？和曾经是等同的吗？

Answer 1

hasAttribute()

hasAttribute()只对html元素起作用，如果该元素具有与给定参数相同的属性名，则返回true。

<div class="myClass"></div>

<script>
    document.querySelector('div').hasAttribute('class'); //true
    document.querySelector('div').hasOwnProperty('class'); //false
</script>

hasOwnProperty()

hasOwnProperty()只对JavaScript对象起作用，如果该对象具有与给定参数同名的属性，则返回true。

var obj = {
    myProp: "my attribute"
}

obj.hasOwnProperty("myProp") //true
obj.hasAttribute("myProp") //false

有些html元素可以在javascript中构建，这就是为什么hasOwnProperty有时适用于它，但hasAttribute对javascript对象不起作用。

Answer 2

HTML：

<span medium-img>Whatever</span>

Javascript：

alert($('span').is('[medium-img]')); // Alerts true