JavaScript Window - The Browser Object Model | lập trình trực tuyến

Thứ Tư, 12 tháng 2, 2014

JavaScript Window - The Browser Object Model

Browser Object Model (BOM) cho phép Javascript để "nói chuyện" trình duyệt.

Browser Object Model (BOM)

Không có tiêu chuẩn chính thức cho B rowser O bject M odel (BOM).

Kể từ khi trình duyệt hiện đại đã thực hiện (gần như) cùng một phương pháp và tài sản để tương tác JavaScript, nó thường được gọi, như các phương pháp và tài sản của HĐQT.

Cửa sổ Object

Các window đối tượng được hỗ trợ bởi tất cả các trình duyệt. Nó đại diện cho cửa sổ của trình duyệt.

Tất cả các đối tượng toàn cầu JavaScript, chức năng, và các biến tự động trở thành thành viên của đối tượng cửa sổ.

Biến toàn cầu là tài sản của đối tượng cửa sổ.

Chức năng toàn cầu là phương pháp của đối tượng cửa sổ.

Ngay cả những đối tượng tài liệu (DOM HTML) là một tài sản của đối tượng cửa sổ:

window.document.getElementById("header");

cũng giống như:

document.getElementById("header");

Kích thước cửa sổ

Ba đặc tính khác nhau có thể được sử dụng để xác định kích thước của cửa sổ trình duyệt (khung nhìn trình duyệt, không bao gồm các thanh công cụ và thanh cuộn).

Đối với Internet Explorer, Chrome, Firefox, Opera, và Safari:

window.innerHeight - chiều cao bên trong của cửa sổ trình duyệt
window.innerWidth - chiều rộng bên trong của cửa sổ trình duyệt

Internet Explorer 8, 7, 6, 5:

document.documentElement.clientHeight
document.documentElement.clientWidth
hoặc
document.body.clientHeight
document.body.clientWidth

Một giải pháp JavaScript thực tế (bao gồm tất cả các trình duyệt):

Ví dụ

<!DOCTYPE html>

<html>

<body>

var w=window.innerWidth

|| document.documentElement.clientWidth

|| document.body.clientWidth;

var h=window.innerHeight

|| document.documentElement.clientHeight

|| document.body.clientHeight;

x=document.getElementById("demo");

x.innerHTML="Browser inner window width: " + w + ", height: " + h + "."

</script>

</body>

</html>

Thử nó cho mình »

Ví dụ hiển thị chiều cao cửa sổ trình duyệt và chiều rộng: (không bao gồm các thanh công cụ / cuộn)

Phương pháp cửa sổ khác

Một số phương pháp khác:

window.open () - mở một cửa sổ mới
window.close () - đóng cửa sổ hiện tại
window.moveTo ()-di chuyển cửa sổ hiện tại
window.resizeTo ()-thay đổi kích thước cửa sổ hiện tại

Các tin khác

lập trình trực tuyến

Pages

Thứ Tư, 12 tháng 2, 2014