Trạng thái và thuộc tính ARIA (attributes)

Trang này liệt kê các trang tham khảo bao quát toàn bộ các thuộc tính WAI-ARIA được thảo luận trên MDN.

Các thuộc tính ARIA cho phép thay đổi các trạng thái và thuộc tính của phần tử như được định nghĩa trong cây khả năng tiếp cận.

Note: ARIA chỉ thay đổi cây khả năng tiếp cận, tức là cách công nghệ hỗ trợ trình bày nội dung cho người dùng của bạn. ARIA không thay đổi chức năng hay hành vi của phần tử. Khi không dùng các phần tử HTML ngữ nghĩa đúng với mục đích và chức năng mặc định của chúng, bạn phải dùng JavaScript để quản lý hành vi, tiêu điểm và các trạng thái ARIA.

Các loại thuộc tính ARIA

Có 4 nhóm trạng thái và thuộc tính ARIA:

Thuộc tính widget

Thuộc tính vùng trực tiếp

Thuộc tính kéo và thả

Thuộc tính quan hệ

Các thuộc tính ARIA toàn cục

Một số trạng thái và thuộc tính áp dụng cho tất cả các phần tử HTML bất kể vai trò ARIA nào được áp dụng. Chúng được xác định là thuộc tính "toàn cục". Các trạng thái và thuộc tính toàn cục được hỗ trợ bởi tất cả các vai trò và phần tử markup cơ sở.

Nhiều thuộc tính ở trên là thuộc tính toàn cục, nghĩa là chúng có thể được đưa vào bất kỳ phần tử nào trừ khi bị cấm rõ ràng:

Theo nghĩa "bị cấm rõ ràng", tất cả các thuộc tính trên đều là thuộc tính toàn cục, ngoại trừ các thuộc tính aria-labelaria-labelledby, vốn không được phép trên các phần tử có vai trò presentation hay vai trò đồng nghĩa none.

Mục lục trạng thái và thuộc tính

Các trang sau đây là tài liệu tham khảo cho các trạng thái và thuộc tính WAI-ARIA được mô tả trên MDN.

ARIA: thuộc tính aria-activedescendant

Thuộc tính aria-activedescendant xác định phần tử hiện đang hoạt động khi tiêu điểm nằm trên một widget composite, combobox, textbox, group, hoặc application.

ARIA: thuộc tính aria-atomic

Trong các vùng trực tiếp ARIA, thuộc tính toàn cục aria-atomic cho biết công nghệ hỗ trợ như trình đọc màn hình sẽ trình bày toàn bộ hay chỉ một phần của vùng đã thay đổi, dựa trên các thông báo thay đổi được định nghĩa bởi thuộc tính aria-relevant.

ARIA: thuộc tính aria-autocomplete

Thuộc tính aria-autocomplete cho biết việc nhập văn bản có thể kích hoạt việc hiển thị một hay nhiều dự đoán về giá trị mà người dùng muốn nhập cho một combobox, searchbox, hoặc textbox hay không, và chỉ rõ các dự đoán đó sẽ được trình bày như thế nào nếu có.

ARIA: thuộc tính aria-braillelabel

Thuộc tính toàn cục aria-braillelabel định nghĩa một giá trị chuỗi gắn nhãn cho phần tử hiện tại, với mục đích được chuyển đổi sang chữ Braille.

ARIA: thuộc tính aria-brailleroledescription

Thuộc tính toàn cục aria-brailleroledescription định nghĩa một mô tả rút gọn, có thể đọc được và do tác giả bản địa hóa, cho vai trò của một phần tử, với mục đích được chuyển đổi sang Braille.

ARIA: thuộc tính aria-busy

Thuộc tính aria-busy là một trạng thái ARIA toàn cục cho biết một phần tử hiện có đang được sửa đổi hay không. Nó giúp công nghệ hỗ trợ hiểu rằng các thay đổi đối với nội dung vẫn chưa hoàn tất, và rằng chúng có thể nên chờ trước khi thông báo bản cập nhật cho người dùng. Mặc dù aria-busy thường được dùng trong vùng trực tiếp ARIA để trì hoãn thông báo cho đến khi bản cập nhật hoàn tất, nó cũng có thể được dùng bên ngoài vùng trực tiếp - ví dụ trong widget hoặc feed - để báo hiệu các thay đổi hoặc tải đang diễn ra.

ARIA: thuộc tính aria-checked

Thuộc tính aria-checked chỉ ra trạng thái "đã chọn" hiện tại của hộp kiểm, nút chọn và các widget khác.

ARIA: thuộc tính aria-colcount

Thuộc tính aria-colcount định nghĩa tổng số cột trong một table, grid, hoặc treegrid khi không phải tất cả các cột đều có mặt trong DOM.

ARIA: thuộc tính aria-colindex

Thuộc tính aria-colindex định nghĩa chỉ số cột hoặc vị trí của một phần tử so với tổng số cột trong một table, grid, hoặc treegrid.

ARIA: thuộc tính aria-colindextext

Thuộc tính aria-colindextext xác định một giá trị văn bản dễ đọc cho chỉ số cột của phần tử.

ARIA: thuộc tính aria-colspan

Thuộc tính aria-colspan định nghĩa số cột mà một ô hoặc gridcell chiếm trong một table, grid, hoặc treegrid.

ARIA: thuộc tính aria-controls

Thuộc tính toàn cục aria-controls xác định phần tử (hoặc các phần tử) mà nội dung hoặc sự hiện diện của chúng được phần tử đặt thuộc tính này điều khiển.

ARIA: thuộc tính aria-current

Trạng thái aria-current khác rỗng trên một phần tử cho biết phần tử đó đại diện cho mục hiện tại trong một vùng chứa hoặc một tập các phần tử liên quan.

ARIA: thuộc tính aria-describedby

Thuộc tính toàn cục aria-describedby xác định phần tử (hoặc các phần tử) mô tả phần tử mà thuộc tính này được đặt lên.

ARIA: thuộc tính aria-description

Thuộc tính toàn cục aria-description định nghĩa một giá trị chuỗi mô tả hoặc chú giải cho phần tử hiện tại.

ARIA: thuộc tính aria-details

Thuộc tính toàn cục aria-details xác định phần tử (hoặc các phần tử) cung cấp thông tin bổ sung liên quan đến đối tượng.

ARIA: thuộc tính aria-disabled

Trạng thái aria-disabled cho biết phần tử có thể được nhận biết nhưng bị vô hiệu hóa, vì vậy nó không thể chỉnh sửa hoặc thực hiện thao tác khác.

ARIA: thuộc tính aria-dropeffect

Thuộc tính toàn cục aria-dropeffect cho biết những chức năng nào có thể được thực hiện khi một đối tượng đang được kéo được thả lên đích thả.

ARIA: thuộc tính aria-errormessage

Thuộc tính aria-errormessage trên một đối tượng xác định phần tử (hoặc các phần tử) cung cấp thông báo lỗi cho đối tượng đó.

ARIA: thuộc tính aria-expanded

Thuộc tính aria-expanded được đặt trên một phần tử để cho biết một control đang được mở rộng hay thu gọn, và liệu các phần tử được điều khiển có đang hiển thị hay bị ẩn hay không.

ARIA: thuộc tính aria-flowto

Thuộc tính toàn cục aria-flowto xác định phần tử tiếp theo trong một thứ tự đọc thay thế của nội dung. Điều này cho phép công nghệ hỗ trợ ghi đè lên thứ tự đọc mặc định chung theo thứ tự nguồn của tài liệu, nếu người dùng muốn.

ARIA: thuộc tính aria-grabbed

Trạng thái aria-grabbed cho biết trạng thái "đang được nắm" của một phần tử trong thao tác kéo và thả.

ARIA: thuộc tính aria-haspopup

Thuộc tính aria-haspopup cho biết phần tử có khả năng kích hoạt một phần tử bật lên bổ sung, chẳng hạn menu hoặc dialog, khi được kích hoạt.

ARIA: thuộc tính aria-hidden

Thuộc tính aria-hidden cho biết một phần tử và tất cả các phần tử con của nó không được công nghệ hỗ trợ trình bày cho người dùng.

ARIA: thuộc tính aria-invalid

aria-invalid là trạng thái cho biết giá trị đã nhập không khớp với định dạng mà ứng dụng mong đợi.

ARIA: thuộc tính aria-keyshortcuts

Thuộc tính toàn cục aria-keyshortcuts cho biết các phím tắt mà tác giả đã triển khai để kích hoạt hoặc đưa tiêu điểm tới một phần tử.

ARIA: thuộc tính aria-label

Thuộc tính aria-label định nghĩa một giá trị chuỗi có thể được dùng để đặt tên cho một phần tử, miễn là vai trò của phần tử đó không cấm đặt tên.

ARIA: thuộc tính aria-labelledby

Thuộc tính aria-labelledby xác định phần tử (hoặc nhiều phần tử) gán nhãn cho phần tử mà nó được áp dụng lên.

ARIA: thuộc tính aria-level

Thuộc tính aria-level định nghĩa mức phân cấp của một phần tử trong một cấu trúc.

ARIA: thuộc tính aria-live

Thuộc tính toàn cục aria-live cho biết một phần tử sẽ được cập nhật, và mô tả các loại cập nhật mà user agent, công nghệ trợ năng, và người dùng có thể mong đợi từ vùng live.

ARIA: thuộc tính aria-modal

Thuộc tính aria-modal cho biết một phần tử có mang tính modal khi được hiển thị hay không.

ARIA: thuộc tính aria-multiline

Thuộc tính aria-multiline cho biết một textbox có chấp nhận nhiều dòng nhập liệu hay chỉ một dòng.

ARIA: thuộc tính aria-multiselectable

Thuộc tính aria-multiselectable cho biết người dùng có thể chọn nhiều hơn một mục trong các phần tử con có thể chọn hiện tại.

ARIA: thuộc tính aria-orientation

Thuộc tính aria-orientation cho biết hướng của phần tử là ngang, dọc hay không xác định/mơ hồ.

ARIA: thuộc tính aria-owns

Thuộc tính aria-owns xác định một phần tử (hoặc nhiều phần tử) để định nghĩa mối quan hệ trực quan, chức năng hoặc ngữ cảnh giữa phần tử cha và các phần tử con của nó khi cấu trúc DOM không thể dùng để biểu diễn mối quan hệ đó.

ARIA: thuộc tính aria-placeholder

Thuộc tính aria-placeholder định nghĩa một gợi ý ngắn gọn, thường là một từ hoặc cụm từ ngắn, nhằm giúp người dùng nhập dữ liệu khi một form control chưa có giá trị. Gợi ý này có thể là một giá trị mẫu hoặc một mô tả ngắn về định dạng mong đợi.

ARIA: thuộc tính aria-posinset

Thuộc tính aria-posinset xác định số thứ tự hoặc vị trí của một phần tử trong tập hiện tại của listitem hoặc treeitem khi không phải tất cả các mục đều có mặt trong DOM.

ARIA: thuộc tính aria-pressed

Thuộc tính aria-pressed cho biết trạng thái "được nhấn" hiện tại của một nút bật tắt.

ARIA: thuộc tính aria-readonly

Thuộc tính aria-readonly cho biết rằng phần tử không thể chỉnh sửa, nhưng vẫn có thể thao tác.

ARIA: thuộc tính aria-relevant

Dùng trong các live region ARIA, thuộc tính toàn cục aria-relevant cho biết user agent sẽ kích hoạt những thông báo nào khi cây trợ năng bên trong live region bị thay đổi.

ARIA: thuộc tính aria-required

Thuộc tính aria-required cho biết rằng người dùng phải nhập dữ liệu vào phần tử đó trước khi có thể gửi biểu mẫu.

ARIA: thuộc tính aria-roledescription

Thuộc tính aria-roledescription định nghĩa một mô tả thân thiện với con người, được tác giả bản địa hóa, cho vai trò của một phần tử.

ARIA: thuộc tính aria-rowcount

Thuộc tính aria-rowcount xác định tổng số hàng trong một bảng, grid hoặc treegrid.

ARIA: thuộc tính aria-rowindex

Thuộc tính aria-rowindex xác định vị trí của một phần tử so với tổng số hàng trong một bảng, grid hoặc treegrid.

ARIA: thuộc tính aria-rowindextext

Thuộc tính aria-rowindextext xác định một văn bản thay thế thân thiện với con người cho aria-rowindex.

ARIA: thuộc tính aria-rowspan

Thuộc tính aria-rowspan xác định số hàng mà một cell hoặc gridcell chiếm trong một bảng, grid hoặc treegrid.

ARIA: thuộc tính aria-selected

Thuộc tính aria-selected cho biết trạng thái "được chọn" hiện tại của nhiều widget khác nhau.

ARIA: thuộc tính aria-setsize

Thuộc tính aria-setsize xác định số lượng mục trong tập hiện tại của listitem hoặc treeitem khi không phải tất cả các mục trong tập đều có mặt trong DOM.

ARIA: thuộc tính aria-sort

Thuộc tính aria-sort cho biết các mục trong một bảng hoặc grid đang được sắp xếp theo thứ tự tăng dần hay giảm dần.

ARIA: thuộc tính aria-valuemax

Thuộc tính aria-valuemax xác định giá trị lớn nhất được phép cho một widget dạng range.

ARIA: thuộc tính aria-valuemin

Thuộc tính aria-valuemin xác định giá trị nhỏ nhất được phép cho một widget dạng range.

ARIA: thuộc tính aria-valuenow

Thuộc tính aria-valuenow xác định giá trị hiện tại cho một widget range.

ARIA: thuộc tính aria-valuetext

Thuộc tính aria-valuetext xác định văn bản thay thế thân thiện với con người cho aria-valuenow của một widget dạng range.

Xem thêm