HTML 屬性是修改 HTML 元素行為的特殊單字。它們在元素的開始標籤內使用，可以修改元素的預設功能或提供必要的功能。從語法上講，屬性被加入到 HTML 開始標記中。它們可以分類為必需、可選、標準或事件屬性，並以名稱-值對的形式編寫，在元素的開始標記內用等號“=”分隔。
下面給出了不同的 HTML 屬性及其詳細工作原理：
主要使用的核心屬性有四：
代碼：
<html> <head> <title>src Attribute</title> </head> <body> <img src=" https://www.google.com/url?sa=i&source=images&cd=&cad=rja&uact=8&ved=2ahUKEwi2lr-WjbvhAhXPXisKHb6JABgQjRx6BAgBEAU&url=https%3A%2F%2Fwww.google.com.mx%2F&psig=AOvVaw2jWnG-ltpLO7QE_Ge7TXeO&ust=1554627554684449"> </body> </html>
範例：
代碼：
<html> <head> <title>Width and Height</title> </head> <body> <img src=" https://www.google.com/url?sa=i&source=images&cd=&cad=rja&uact=8&ved=2ahUKEwi2lr-WjbvhAhXPXisKHb6JABgQjRx6BAgBEAU&url=https%3A%2F%2Fwww.google.com.mx%2F&psig=AOvVaw2jWnG-ltpLO7QE_Ge7TXeO&ust=1554627554684449" width="300px" height="100px"> </body> </html>
HTML provides custom data attributes that allow adding additional information related to the content in HTML tags. These attributes are not specific to HTML5 and can be used on all HTML elements. The data-* attribute enables the creation of custom data attributes that can store private data for the page or application.
In order to customize, one divides the data into two parts:
The syntax for a data attribute is as follows:
<li data-book-author="Rabindra Nath Tagore"> Gitanjali </li>
To retrieve the NamedNodeMap objects, one can use the attribute properties in the HTML DOM. This will return a group of node attributes. The NamedNodeMap represents a collection of attribute objects, which can be accessed by their index number, starting at 0. To use this, the user can access the node’s attributes using the syntax node.attributes.
The value returned is a NamedNodeMap object that contains all the attributes in the collection of nodes. However, if someone is using Internet Explorer 8 or an earlier version, the attributes property may return all possible attributes for any element, resulting in more values than expected.
Example:
Code:
<!DOCTYPE html>
<html>
<head>
<title>
HTML DOM attributes Property
</title>
</head>
<body>
<h2>
HTML DOM attributes Property
</h2>
<button id = "CBA" onclick = "myeduCBA()">
Click Here!
</button>
<br><br>
<span>
Button element attributes:
</span>
<span id="sudo"></span>
<script>
function myeduCBA() {
// It returns the number of nodes
var cba = document.getElementById("CBA").attributes.length;
// Display the number of nodes
document.getElementById("sudo").innerHTML = cba;
}
</script>
</body>
</html>
The output for above program will be
Button element attributes: 2HTML also provides global attributes that can work with any HTML element:
HTML has the ability to trigger actions when some events take place.
Actions inside an HTML form trigger these events.
HTML 隨著時間的推移而不斷發展，提供了核心、國際化、資料、全局和事件等廣泛的屬性，使 Web 應用程式和頁面更具互動性。與 CSS 結合，HTML 可以輕鬆自訂 Web 元素，以建立具有視覺吸引力的 Web 應用程式。
以上是HTML 屬性的詳細內容。更多資訊請關注PHP中文網其他相關文章！
