Điểm mới trên nền tảng web vào tháng 5

Khám phá một số tính năng thú vị đã ra mắt trong các trình duyệt web phiên bản ổn định và beta trong tháng 5 năm 2022.

Vào tháng 5, Chrome 102, Safari 15.5, Firefox 100Firefox 101 đã trở nên ổn định.

Chrome 102 và Safari 15.5 bao gồm thuộc tính inert. Thao tác này sẽ xoá các phần tử khỏi thứ tự thẻ và cây hỗ trợ tiếp cận nếu các phần tử đó không tương tác. Ví dụ: một phần tử hiện không hiển thị trên màn hình hoặc bị ẩn.

Hỗ trợ trình duyệt

  • Chrome: 102.
  • Edge: 102.
  • Firefox: 112.
  • Safari: 15.5.

Nguồn

Chrome 102 bao gồm giá trị mới until-found cho thuộc tính hidden HTML. Thao tác này cho phép tìm trong trang và cuộn đến mảnh văn bản trên văn bản nằm bên trong một khu vực thu gọn của trang, như bạn có thể thấy trong mẫu xếp nếp. Tìm hiểu thêm trong bài đăng Giúp người dùng truy cập nội dung thu gọn bằng hidden=until-found.

Hỗ trợ trình duyệt

  • Chrome: 102.
  • Edge: 102.
  • Firefox: không được hỗ trợ.
  • Safari: không được hỗ trợ.

Nguồn

Chrome 102 cung cấp Navigation API (API điều hướng), một API chuẩn hoá việc định tuyến phía máy khách trong các ứng dụng một trang. API này trước đây được gọi là API Nhật ký ứng dụng.

Hỗ trợ trình duyệt

  • Chrome: 102.
  • Edge: 102.
  • Firefox: không được hỗ trợ.
  • Safari: không được hỗ trợ.

Nguồn

Firefox 101 hỗ trợ các kiểu trang có thể tạo. Hỗ trợ bao gồm hàm khởi tạo CSSStyleSheet(), cũng như các phương thức replace()replaceSync(). Các tệp kiểu có thể tạo giúp bạn dễ dàng tạo tệp kiểu để sử dụng với Shadow DOM. Trong ví dụ sau, một tệp kiểu được tạo bằng hàm khởi tạo CSSStyleSheet(), một quy tắc CSS được thêm bằng phương thức replaceSync() và quy tắc thu được được in vào bảng điều khiển.

const stylesheet = new CSSStyleSheet();
stylesheet.replaceSync('body { color: red; }');
console.log(stylesheet.rules[0].cssText);

Hỗ trợ trình duyệt

  • Chrome: 73.
  • Edge: 79.
  • Firefox: 101.
  • Safari: 16.4.

Nguồn

Ngoài ra, Firefox 101 còn có tính năng nội dung đa phương tiện prefers-contrast, giúp tính năng này hoạt động trên nhiều trình duyệt.

Hỗ trợ trình duyệt

  • Chrome: 96.
  • Edge: 96.
  • Firefox: 101.
  • Safari: 14.1.

Nguồn

Bản phát hành trình duyệt beta

Các phiên bản trình duyệt beta cho bạn xem trước những tính năng sẽ có trong phiên bản chính thức tiếp theo của trình duyệt. Đây là thời điểm thích hợp để thử nghiệm các tính năng mới hoặc các nội dung bị xoá có thể ảnh hưởng đến trang web của bạn trước khi chúng tôi phát hành bản cập nhật đó trên toàn cầu.

Các bản thử nghiệm beta mới trong tháng 4 là Chrome 103Firefox 102.

Firefox 102 có tính năng đa phương tiện update. Thuộc tính này dùng để truy vấn xem thiết bị đầu ra có thể sửa đổi giao diện của nội dung sau khi nội dung đó được kết xuất hay không. Thuộc tính này chấp nhận các giá trị sau:

none
Sau khi kết xuất, bạn không thể cập nhật nội dung. Ví dụ: tài liệu in.
slow
Thiết bị có thể cập nhật nội dung, nhưng quá chậm để hiển thị ảnh động mượt mà. Ví dụ: màn hình E-ink.
fast
Nội dung có thể thay đổi linh động và đủ nhanh để kết xuất ảnh động. Ví dụ: màn hình máy tính hoặc điện thoại.

Hỗ trợ trình duyệt

  • Chrome: 113.
  • Edge: 113.
  • Firefox: 102.
  • Safari: 17.

Nguồn

Chrome 103 bao gồm Local Font Access API (API truy cập phông chữ trên máy), cho phép truy cập vào các phông chữ mà người dùng đã cài đặt trên máy.

Các tính năng thử nghiệm này sẽ sớm ra mắt trong các trình duyệt ổn định.

Chỉnh sửa: Phiên bản trước của bài đăng này có đề cập đến phương thức Element.isVisible(), nhưng phương thức này không được cung cấp trong bản phát hành này.

Một phần của chương trình Mới làm quen với web