Cách ghi đè hướng văn bản (unicodeBidi) hỗ trợ đa ngôn ngữ bằng JavaScript

Thuộc tính unicodeBidi (Unicode Bidirectional Algorithm) kiểm soát cách xử lý hướng văn bản khi trộn lẫn LTR (left-to-right) và RTL (right-to-left) trong cùng tài liệu. Giá trị chính: normal, embed, bidi-override, isolate, isolate-override, plaintext.

Ví dụ minh họa

Mã sau áp dụng bidi-override cho đoạn văn RTL khi nhấn nút (buộc hiển thị theo thứ tự logic, bỏ qua quy tắc bidi tự nhiên):

<!DOCTYPE html>
<html>
<body>
  <p id="pid" style="direction: rtl;">Văn bản Demo</p>
  <button type="button" onclick="setBidiOverride()">Đặt bidi-override</button>
  <script>
    function setBidiOverride() {
      document.getElementById("pid").style.unicodeBidi = "bidi-override";
      /* Buộc trình duyệt tuân theo direction (rtl/ltr) và thứ tự ký tự trong mã,
         bỏ qua thuật toán bidi tự nhiên. */
    }
  </script>
</body>
</html>

Các giá trị của unicodeBidi

Giá trị	Mô tả	Khi nào dùng
`normal`	Mặc định: dùng thuật toán bidi tự nhiên	Văn bản đơn hướng hoặc trộn nhẹ
`embed`	Mở cấp độ embedding mới (cho inline)	Đoạn LTR trong RTL hoặc ngược lại
`bidi-override`	Ghi đè hoàn toàn: tuân theo `direction` và thứ tự mã	Số điện thoại, mã code, tên riêng trong RTL
`isolate`	Tách biệt: nội dung không ảnh hưởng/huỳng bởi bên ngoài	Widget, comment người dùng
`isolate-override`	Kết hợp isolate + override	Nội dung nhúng phức tạp
`plaintext`	Dựa trên heuristics đoạn văn (không dùng direction)	Input người dùng không xác định hướng

Lưu ý:

Luôn dùng kèm direction: rtl hoặc direction: ltr.
bidi-override mạnh nhất: buộc hiển thị chính xác thứ tự ký tự trong DOM.
Hiện đại: Ưu tiên dùng thẻ <bdi> (BiDi Isolate) hoặc thuộc tính dir="auto" cho nội dung người dùng.