HTML - DOM 元素 hasAttributes() 方法



hasAttributes() 方法检查 HTML DOM 中的元素是否具有属性。如果元素具有一个或多个属性,则返回“true”,否则返回“false”。

注意:hasAttribute() 方法检查特定属性的存在,而 hasAttributes() 方法检查元素是否根本有任何属性。

语法

element.hasAttributes();

返回值

此方法返回一个布尔值:如果元素具有属性,则返回“true”;否则返回“false”。

HTML DOM 元素“hasAttributes()”方法示例

以下是一些 hasAttribute() 方法的示例,它检查 HTML DOM 元素中特定属性的存在。

检查 Div 元素是否有任何属性

此示例演示如何使用 hasAttribute() 方法检查任何属性,然后在单击按钮时显示结果。它检查id=exampleDiv 的<div>元素是否具有任何属性。

<!DOCTYPE html>
<html lang="en">
<head> 
    <title>
        HTML DOM Element hasAttributes() Method
    </title>
</head>

<body>
    <h1>HTML - DOM Element</h1>
    <h2>hasAttributes() Method</h2>  

    <div id="exampleDiv" title="Sample Div">
        Does it has any attributes?
    </div>
    <br>
    <button onclick="checkAttributes()">
       Check Attributes
    </button>
    <p id="result"></p>

    <script>
        function checkAttributes() {
            const divElement = document.getElementById
            ('exampleDiv');   

            document.getElementById('result').textContent=
               "The div has attributes.";
            
        }
    </script>
</body>

</html>

检查 Body 元素的属性

此示例检查 body 元素是否具有任何属性。由于此示例中的 body 元素没有任何属性,因此 hasAttributes() 方法返回 false 并显示相应的讯息。

<!DOCTYPE html>
<html lang="en">
<head> 
    <title>
        HTML DOM Element hasAttributes() Method
    </title>
</head>

<body>
    <h1>HTML - DOM Element </h1>
    <h2>hasAttributes() Method</h2>
    <p>Does Body element has any attribute?</p>
    
    <button onclick="checkAttributes()">
        Check Body Attributes
    </button>
    <p id="result"></p>

    <script>
        function checkAttributes() {
            const bodyElement = document.body; 
            document.getElementById('result').textContent= 
            "Body element does not have any attributes.";
        }
    </script>
</body>

</html>

检查锚标签是否具有属性

此示例检查锚点(<a>)标签在 HTML 元素中是否具有任何属性,并相应地显示消息。

<!DOCTYPE html>
<html lang="en">
<head> 
    <title>
        HTML DOM Element hasAttributes() Method
    </title>
</head>

<body>
    <h1>HTML - DOM Element</h1>
    <h2>hasAttributes() Method</h2> 
    <p>Checks if Anchor tag has any Attributes</p> 
    
    <a id="myLink" href=
"https://tutorialspoint.com/">
        Example Link
    </a>
    
    <button onclick="checkAttributes()">
        Check Attributes
    </button>
    <p id="result"></p>
    
    <script>
        function checkAttributes() {
            const linkElement = document.getElementById
            ('myLink');                       
            document.getElementById('result').textContent = 
            "The link has attributes.";      
        }
    </script>
</body>

</html>    

支持的浏览器

方法 Chrome Edge Firefox Safari Opera
hasAttributes()
html_dom_element_reference.htm
广告