Đối tượng Ul trong HTML DOM

Đối tượng Ul trong HTML DOM đại diện cho phần tử <ul>.

Tạo phần tử <ul>

var ulObject = document.createElement("UL")

Đối tượng "ulObject" có thể có các thuộc tính sau nhưng không được hỗ trợ trong HTML5:

Thuộc tính	Mô tả
compact	Thiết lập/trả về việc danh sách không thứ tự có nên hiển thị nhỏ hơn bình thường
type	Thiết lập/trả về giá trị của thuộc tính type của danh sách không thứ tự

Ví dụ

Dưới đây là ví dụ minh họa phần tử unordered list:

<!DOCTYPE html>
<html>
<head>
  <title>Ul item()</title>
  <style>
    form { width: 70%; margin: 0 auto; text-align: center; }
    * { padding: 2px; margin: 5px; }
    input[type="button"] { border-radius: 10px; }
    ul { width: 30%; margin: 0 auto; }
  </style>
</head>
<body>
  <form>
    <fieldset>
      <legend>item()</legend>
      <h2>Thực Đơn</h2>
      <ul>
        <li onclick="getOrder(0)">Mỳ & Phô Mai</li>
        <li onclick="getOrder(1)">Pizza</li>
        <li onclick="getOrder(2)">Burger</li>
      </ul>
      <div id="divDisplay">Nhấp vào món trong thực đơn để đặt</div>
    </fieldset>
  </form>
  <script>
    var divDisplay = document.getElementById("divDisplay");
    var menuSelect = document.getElementsByTagName("li");
    function getOrder(index) {
      divDisplay.textContent = 'Đặt Hàng: ' + (menuSelect.item(index)).textContent;
    }
  </script>
</body>
</html>

Kết quả

Trước khi nhấn phần tử '<li>':

Đối tượng Ul trong HTML DOM

Sau khi nhấn phần tử '<li>':

Đối tượng Ul trong HTML DOM