Chúng ta đã đi qua DOM và bây giờ là BOM , vậy BOM là gì ? BOM có giống DOM không ? Chắc hẳn là không bởi vì nếu giống thì chúng ta không cần học BOM :D. Mình xin được đi vào và giải quyết vấn đề chính luôn.
BOM là gì ?
BOM – Browser Object Model là mô hình đối tượng trình duyệt Mô hình đối tượng trình duyệt tạo ra một hệ thống phân cấp đối tượng theo hình cây, rất nhiều trong số đó cung cấp các thuộc tính và phương thức cho lập trình
viên JavaScript. Bản thân trình duyệt được biểu diễn bởi một đối tượng gọi là window.
Đối tượng window có một số đối tượng con sau:
- document
- frame
- history
- location
- navigator
- screen
- self/window/parent
Đối tượng window
Đối tượng window là đối tượng toàn cục gắn với cửa sổ đang mở trong trình duyệt. Đối tượng window có một vài thuộc tính, phương thức và đối tượng con.Bạn đã sử dụng một số phương thức này như alert() và prompt(). Vì window là đối tượng toàn cục nên bạn không cần đặt từ window trước các thuộc tính và phương thức. Thay vào đó, bạn có thể trực tiếp gọi chúng như trong các ví dụ gọi thẳng đến phương thức alert(). Các đối tượng con trực tiếp của window không cần phải có tiền tố window, nhưng khi làm việc với các đối tượng không phải là đối tượng con trực tiếp của window, bạn cần thêm tên đối tượng window trước nó. Ngoại lệ với document :D.
VD:
alert("abcxyz"); // không cần tiền tố window.
document.Image[0] // cần tiền tố document. nhưng không cần window.Đối tượng window cũng có các thuộc tính và phương thức. Trong số các thuộc tính đó có những thuộc tính tự thân, tức là những thuộc tính thuộc về window.
Các thuộc tính và phương thức thường sử dụng
Thuộc tính:
| Thuộc tính | Mô tả |
| closed | Có giá trị true khi cửa sổ bị đóng. |
| defaultStatus | Dùng để thiết lập dòng chữ mặc định trên thanh trạng thái của trình duyệt. |
| name | Tên của cửa sổ khi nó mới mở ra lần đầu. |
| opener | Tham chiếu đến cửa sổ tạo ra nó. |
| parent | Thường dùng để chỉ frame/window cha chứa/sinh ra frame/window hiện tại. |
| status | Thường dùng để thiết lập đoạn văn bản sẽ hiển thị trên thanh trạng thái khi người dùng di chuột qua một phần tử, ví dụ như đường liên kết. |
| top | Chỉ cửa sổ cha ở trên cùng. |
Phương thức:
| Phương thức | Mô tả |
| addEventListener() | Phương thức tạo hàm xử lý sự kiện trên các trình duyệt |
| blur() | Thay đổi tiêu điểm của bàn phím ra khỏi cửa sổ trình duyệt |
| focus() | Chuyển tiêu điểm của bàn phím vào cửa sổ trình duyệt. |
| close() | Đóng cửa sổ trình duyệt. |
| removeEventListener() | Phương thức bỏ hàm xử lý sự kiện trên các trình duyệt |
| open() | Mở một cửa sổ. |
| print() | Gọi chức năng in từ trình duyệt: xử lý tương tự như khi người dùng nhấn Print trong trình duyệt. |
Phần này khá mông lung đúng không, mình sẽ làm nhiều ví dụ để các bạn có thể hiểu rõ nó trong những bài viết sau. Mình xin được kết thúc bài viết tại đây.
Xem bài viết tiếp theo tại đây.
Trả lời