Thuộc tính abbr của HTML DOM TableHeader trả về và sửa đổi giá trị của thuộc tính abbr của bảng trong tài liệu HTML.
Cú pháp
Sau đây là cú pháp -
1. Trả lại abbr
object.abbr
2. Thêm abbr
object.abbr = “text”
Hãy để chúng tôi xem một ví dụ về thuộc tính abbr:
Ví dụ
<!DOCTYPE html>
<html>
<style>
body {
color: #000;
background: lightblue;
height: 100vh;
text-align: center;
}
table {
margin: 2rem auto;
width: 400px;
}
.btn {
background: #db133a;
border: none;
height: 2rem;
border-radius: 2px;
width: 40%;
display: block;
color: #fff;
outline: none;
cursor: pointer;
margin: 1rem auto;
}
</style>
<body>
<h1>DOM TableHeader abbr Property Demo</h1>
<table border="2">
<thead>
<tr>
<th>Name</th>
<th>Language</th>
</tr>
<thead>
<tbody>
<tr>
<td id="john">John</td>
<td abbr="Eng" id="john-lang">English</td>
</tr>
<tr>
<td id="elon">Elon</td>
<td abbr="Ger" id="elon-lang">Germany</td>
</tr>
</tbody>
</table>
<button onclick="get()" class="btn">Show abbr Value</button>
<div class="show"></div>
<script>
function get() {
document.querySelector(".show").innerHTML = "abbr for English: " + document.querySelector("#john-lang").abbr;
}
</script>
</body>
</html> Đầu ra
Nhấp vào “ Hiển thị giá trị abbr ”Để hiển thị giá trị của thuộc tính abbr.
