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

Khám phá một số tính năng thú vị đã xuất hiện trong các trình duyệt web ổn định và beta trong tháng 10 năm 2025.

Rachel Andrew

Ngày xuất bản: 30 tháng 10 năm 2025

Bản phát hành trình duyệt ổn định

Chrome 142 và Firefox 144 được phát hành cho phiên bản ổn định trong tháng 10. Bài đăng này sẽ xem xét ý nghĩa của việc đó đối với nền tảng web.

API Chuyển đổi khung hiển thị cho ứng dụng một trang

Firefox 144 hỗ trợ hiệu ứng chuyển đổi chế độ xem trong cùng một tài liệu. Trong đó có hỗ trợ cho:

• Lớp giả :active-view-transition
• Thuộc tính view-transition-class
• Thuộc tính view-transition-name
• Phần tử giả ::view-transition
• Phần tử giả ::view-transition-group()
• Phần tử giả ::view-transition-image-pair()
• Phần tử giả ::view-transition-new()
• Phần tử giả ::view-transition-old()

Điều này giúp chuyển đổi chế độ xem cùng tài liệu Cơ sở mới có sẵn.

Các thuộc tính command và commandfor trên phần tử <button>

Firefox 144 hỗ trợ command và commandfor. Bạn có thể tìm hiểu thêm về các thuộc tính này trong bài viết Giới thiệu về command và commandfor.

Phương thức moveBefore()

Phương thức moveBefore() hiện được Firefox hỗ trợ trên các giao diện Element, DocumentFragment và Document. Điều này cho phép bạn di chuyển một phần tử con ngay lập tức của đối tượng, trước một phần tử con khác của đối tượng đó, trong đó cả hai phần tử đều giữ nguyên trạng thái của chúng.

Tìm hiểu thêm trong bài viết Duy trì trạng thái trong quá trình thay đổi DOM bằng moveBefore().

Các lớp giả :target-before và :target-after

Chrome 142 bổ sung các lớp giả khớp với các điểm đánh dấu cuộn nằm trước hoặc sau điểm đánh dấu đang hoạt động (khớp với :target-current) trong cùng một nhóm điểm đánh dấu cuộn, theo thứ tự cây phẳng:

• :target-before: So khớp tất cả các điểm đánh dấu cuộn đứng trước điểm đánh dấu đang hoạt động theo thứ tự cây phẳng trong nhóm.
• :target-after: So khớp tất cả các điểm đánh dấu cuộn theo điểm đánh dấu đang hoạt động theo thứ tự cây phẳng trong nhóm.

Cú pháp phạm vi cho truy vấn vùng chứa kiểu và if()

Chrome 142 cải thiện các truy vấn kiểu CSS và hàm if() bằng cách thêm chế độ hỗ trợ cho cú pháp phạm vi.

Tính năng này mở rộng các truy vấn kiểu ngoài việc so khớp giá trị chính xác (ví dụ: style(--theme: dark)). Nhà phát triển có thể sử dụng các toán tử so sánh (chẳng hạn như > và <) để so sánh các thuộc tính tuỳ chỉnh, giá trị cố định (ví dụ: 10px hoặc 25%) và các giá trị từ các hàm thay thế như attr() và env(). Để so sánh hợp lệ, cả hai bên phải phân giải thành cùng một kiểu dữ liệu. Loại này chỉ giới hạn ở các kiểu số sau: <length>, <number>, <percentage>, <angle>, <time>, <frequency> và <resolution>.

Công cụ kích hoạt mối quan tâm (thuộc tính interestfor)

Chrome 142 cũng thêm một thuộc tính interestfor vào các phần tử <button> và <a>. Thuộc tính này thêm các hành vi "quan tâm" vào phần tử. Khi người dùng thể hiện sự quan tâm đến phần tử, các thao tác sẽ được kích hoạt trên phần tử đích, chẳng hạn như hiển thị một cửa sổ bật lên.

Tác nhân người dùng phát hiện thời điểm người dùng thể hiện sự quan tâm đến phần tử thông qua các phương thức như giữ con trỏ trên phần tử, nhấn các phím nóng đặc biệt trên bàn phím hoặc nhấn và giữ phần tử trên màn hình cảm ứng. Khi người dùng thể hiện sự quan tâm hoặc không còn quan tâm, một InterestEvent sẽ kích hoạt trên mục tiêu, mục tiêu này có các thao tác mặc định cho cửa sổ bật lên, chẳng hạn như hiện và ẩn cửa sổ bật lên.

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

Phiên bản trình duyệt beta giúp bạn xem trước những tính năng sẽ có trong phiên bản ổn định tiếp theo của trình duyệt. Đây là thời điểm thích hợp để kiểm thử các tính năng mới hoặc việc xoá các tính năng có thể ảnh hưởng đến trang web của bạn trước khi bản phát hành đó ra mắt trên toàn thế giới. Các phiên bản thử nghiệm mới trong tháng này là Firefox 145 và Chrome 143, với Safari 26.1 đang diễn ra.

Firefox 145 bao gồm thuộc tính source của giao diện ToggleEvent và phương thức tĩnh Atomics.waitAsync().

Chrome 145 có các truy vấn vùng chứa dự phòng được neo CSS. Điều này giới thiệu @container anchored(fallback) để tạo kiểu cho các phần tử con của phần tử được định vị bằng phần tử neo dựa trên giá trị position-try-fallbacks được áp dụng.