Video hướng dẫn từ WebMagisters. Douglas Crockford "JavaScript: Điểm mạnh"

Lựa chọn vật liệu cho học JavaScript cho bất kỳ cấp độ đào tạo nào - chúng tôi đã thu thập tài nguyên hữu ích, phù hợp cho cả người mới bắt đầu và chuyên gia.

Người mới bắt đầu Marijn Haverbeke "JavaScript biểu cảm"

Cuốn sách đề cập đến các khái niệm cơ bản không chỉ về JS mà còn về lập trình nói chung. Ngoài việc nghiên cứu lý thuyết, tác giả sẽ đề xuất thực hiện một số dự án thực tế thú vị. Ví dụ: tạo ngôn ngữ lập trình của riêng bạn.

Khóa học JavaScript Jedi từ Sorax

Khóa học video từ lập trình viên nổi tiếng và một giáo viên tên Sorax là người tuyệt vời khi bắt đầu học JS.

Video hướng dẫn từ WebMagisters

Một khóa học video tuyệt vời khác bằng tiếng Nga sẽ cho bạn biết những điều cơ bản về JS và cách sử dụng nó đúng cách trong phát triển web.

JavaScript30

nói tiếng anh 30 ngày khóa học thực hành bởi JS. Tác giả không dựa nhiều vào lý thuyết nhưng ngay từ bài học đầu tiên đã gợi ý viết dự án thú vị, điều này trở nên khó khăn hơn theo từng bài học.

Dành cho những người biết căn bản Hướng dẫn JavaScript hiện đại

Một hướng dẫn tương tác sẽ hữu ích như nhau cho cả người mới bắt đầu và lập trình viên đã nghiên cứu những điều cơ bản. Nó chứa đựng nhiều điều tinh tế và thủ thuật liên quan đến công việc của JS và DOM.

Eddie Osmani "Mẫu cho các ứng dụng JavaScript có thể mở rộng" JavaScript. Mẫu

Cuốn sách này cũng là tài liệu hướng dẫn một số lượng lớn ví dụ thực tế và hướng dẫn đầy đủ về các khái niệm cơ bản. Được đề xuất cho các lập trình viên cần học ngôn ngữ lập trình web cũng như các lập trình viên đã sử dụng JS và muốn thành thạo nó một cách hoàn hảo.

Douglas Crockford "JavaScript: điểm mạnh»

JS - còn xa lắm ngôn ngữ tốt nhất lập trình, đặc biệt là khi nói đến việc tối ưu hóa nó. Vì nó được tạo ra một cách vội vàng nên nó có rất nhiều những điểm yếu và những thiết kế khủng khiếp. Đây chính xác là những gì tác giả dự định nói trên các trang sách của mình, đồng thời hiểu được điều gì quyết định điểm mạnh của ngôn ngữ và cách điều này sẽ giúp tạo ra mã thực sự có thể mở rộng và hiệu quả.

McLaughlin B. “Học AJAX”

Cuốn sách dành cho những ai muốn hiểu rõ hơn về cách thức hoạt động của AJAX. Được đề xuất cho những ai muốn đưa tác phẩm của mình lên một tầm cao mới ứng dụng tương tác cho trang web.

Tom Coleman & Sasha Greif “Khám phá sao băng. Xây dựng ứng dụng web JavaScript thời gian thực"

Cuốn sách này dành riêng cho Meteor.js - một framework được xây dựng trên cơ sở Node.js và về cơ bản là một lớp nhanh giữa giao diện và cơ sở dữ liệu. Nó cho phép bạn tạo các ứng dụng JS tương tác thực sự và sử dụng một mã duy nhất trên cả máy chủ và máy khách.

Tài liệu về Meteor.js

Tài liệu của Meteor.js được cộng đồng dịch sang tiếng Nga.

Mark Bates "CoffeeScript. Làn gió thứ hai của JavaScript"

Nếu bạn đã biết và sử dụng CoffeeScript trong công việc thì cuốn sách này sẽ giúp bạn thực hiện công việc của mình tốt hơn. Và nếu không, nó sẽ là một hướng dẫn tuyệt vời và một cuốn sách tham khảo chính về chủ đề này. Ấn phẩm này chủ yếu dành cho các nhà phát triển web sử dụng JS, cũng như tất cả những ai muốn viết mã chất lượng cao và dễ hiểu.

Maximiliano Firtman “jQuery Mobile. Phát triển ứng dụng cho điện thoại thông minh và máy tính bảng"

Cuốn sách nói về việc tạo các ứng dụng web động bằng cách sử dụng JS, AJAX và thư viện jQuery. Nó cũng chú ý đến việc tạo ra các ứng dụng có khả năng hoạt động ngoại tuyến tự động.

Chúng tôi đã thu thập một số hướng dẫn tuyệt vời trên Internet để làm việc và học tập Angular.js và trình bày chúng để bạn chú ý.

Tiếp tục lựa chọn tài liệu về Angular, lần này có liên kết đến nhiều nguồn hữu ích khác nhau, chẳng hạn như phần trình bày về khung phiên bản 2 (để tìm hiểu những gì đã thay đổi và xuất hiện trong phiên bản mới framework từ nguồn ban đầu), cũng như các podcast thú vị và các tài liệu khác có thể hữu ích trong việc học Angular.js.

Video hướng dẫn về Node.js

Khóa học video ngắn về Node.js - phù hợp cho những người hoàn toàn chưa quen với framework này và cho những ai muốn cập nhật kiến thức về nó.

Video hướng dẫn về CoffeeScript từ Sorax.

Một loạt hướng dẫn khác từ Sorax, lần này dành cho những người dùng JS nâng cao hơn muốn làm quen với CoffeeScript. Thật tuyệt khi xem ngay sau khóa học JavaScript cơ bản.

Cuốn sách "Chủ nghĩa siêu thực trong JavaScript".

Một hướng dẫn tuyệt vời dành cho những ai thích học những điều mới thông qua thực hành - cuốn sách sẽ cho bạn biết cách tạo các ứng dụng phức tạp như trò chơi bằng JS.

Sơ lược: Trong Phần 1 của loạt Cẩm nang khái niệm JavaScript hiện đại, chúng tôi sẽ giới thiệu về lập trình chức năng (FP), lập trình phản ứng (RP) và lập trình phản ứng chức năng (FRP). Để làm điều này, chúng ta sẽ tìm hiểu về độ tinh khiết, trạng thái và tính không trạng thái, tính bất biến và khả năng thay đổi, lập trình mệnh lệnh và khai báo, các hàm bậc cao hơn, các vật thể quan sát được và các mô hình FP, RP, FRP.

Giới thiệu

Phía sau những năm trước JavaScript đã phát triển rất nhiều và không nghĩ nó sẽ dừng lại ở đó. Tuy nhiên, nhiều khái niệm sinh ra trong các blog và tài liệu về JS vẫn chưa được nhiều nhà phát triển giao diện xác nhận. Trong loạt bài viết này, chúng ta sẽ khám phá các khái niệm đòi hỏi cả trình độ kiến thức trung cấp và nâng cao cũng như cách chúng phù hợp với JavaScript hiện đại.

Các khái niệm

Trong bài viết này, chúng tôi sẽ đề cập đến các khái niệm quan trọng để hiểu về lập trình chức năng, lập trình phản ứng và lập trình phản ứng chức năng cũng như cách sử dụng chúng với JavaScript:

Độ tinh khiết: chức năng thuần túy, chức năng không tinh khiết, tác dụng phụ
Điều kiện: có và không có nó
Tính bất biến và khả năng thay đổi
Lập trình mệnh lệnh và khai báo
Hàm bậc cao hơn
Lập trình chức năng
Quan sát: nóng và lạnh
Lập trình phản ứng
Lập trình phản ứng chức năng

độ tinh khiết Hàm thuần túy

Giá trị trả về của hàm thuần túy chỉ phụ thuộc vào dữ liệu đầu vào (đối số) của nó và không gây ra bất kỳ tác dụng phụ nào. Với cùng một đối số đầu vào, kết quả sẽ luôn giống nhau. Ví dụ:

Hàm một nửa(x) (
trả về x/2;
}

Hàm Half(x) lấy một số x và trả về giá trị của một nửa x . Nếu chúng ta truyền đối số 8 cho hàm này, nó sẽ trả về 4. Sau khi được gọi, một hàm thuần túy luôn có thể được thay thế bằng kết quả công việc của nó. Ví dụ: chúng ta có thể thay thế một nửa (8) bằng 4: bất cứ khi nào hàm này được sử dụng trong mã của chúng ta, việc thay thế sẽ không có hiệu lực kết quả cuối cùng. Điều này được gọi là tính minh bạch tham chiếu.

Các hàm thuần túy chỉ phụ thuộc vào những gì được truyền cho chúng. Ví dụ: một hàm thuần túy không thể tham chiếu các biến trong phạm vi của hàm cha trừ khi chúng được truyền rõ ràng cho hàm đó dưới dạng đối số. Ngay cả khi đó, hàm không thể thay đổi bất cứ điều gì trong phạm vi gốc của nó.

Var someNum = 8;

// đây KHÔNG phải là hàm thuần túy
hàm không tinh khiếtHalf() (
trả về một sốNum/2;
}

Các hàm thuần túy phải có đối số.
Các đầu vào (đối số) giống nhau sẽ luôn tạo ra cùng một đầu ra (trả về cùng một kết quả).
Các hàm thuần túy chỉ dựa trên trạng thái bên trong và không thay đổi trạng thái bên ngoài ( ghi chú: console.log thay đổi trạng thái toàn cầu).
Các chức năng thuần túy không tạo ra tác dụng phụ.
Hàm thuần túy không thể gọi hàm không tinh khiết.

Hàm không tinh khiết

Một hàm không tinh khiết thay đổi trạng thái ngoài phạm vi của nó. Bất kỳ chức năng nào với phản ứng phụ(xem bên dưới) không sạch, giống như các hàm thủ tục không có giá trị trả về.

Hãy xem xét các ví dụ sau:

Tác dụng phụ trong JavaScript

Khi một hàm hoặc biểu thức thay đổi trạng thái bên ngoài ngữ cảnh của nó, kết quả sẽ là một tác dụng phụ. Ví dụ về các tác dụng phụ: gọi API, thao tác DOM, xuất cảnh báo, ghi vào cơ sở dữ liệu, v.v. Nếu một chức năng tạo ra tác dụng phụ, nó được coi là ô uế. Các chức năng gây ra tác dụng phụ khó dự đoán hơn và khó kiểm tra hơn vì chúng gây ra những thay đổi nằm ngoài phạm vi cục bộ của chúng.

Tóm lại: sạch sẽ

Rất nhiều mã tốt bao gồm các hàm không thuần khiết được gọi theo thủ tục bởi các hàm thuần túy. Điều này vẫn có rất nhiều lợi ích cho việc thử nghiệm và tính bất biến. Tính minh bạch tham chiếu cũng có sự tiện lợi của việc ghi nhớ: lưu vào bộ nhớ đệm và lưu trữ kết quả của các lệnh gọi hàm, sau đó sử dụng lại các kết quả được lưu trong bộ nhớ đệm. Tuy nhiên, việc xác định khi nào các hàm thực sự thuần khiết có thể khó khăn.

Thông tin bổ sung về độ sạch có thể được tìm thấy trong các nguồn sau:

Hàm tinh khiết hoặc không tinh khiết
Lập trình hàm: Hàm thuần túy

Tình trạng

Nêu rõ — thông tin mà chương trình có quyền truy cập và có thể hoạt động tại một thời điểm nhất định. Điều này bao gồm dữ liệu được lưu trữ trong bộ nhớ, cổng I/O, cơ sở dữ liệu, v.v. Ví dụ: nội dung của các biến trong một ứng dụng ở bất kỳ khoảnh khắc này thời gian là đại diện cho trạng thái của ứng dụng.

Với một gia tài

Các chương trình, ứng dụng hoặc thành phần có trạng thái lưu trữ dữ liệu trạng thái hiện tại trong bộ nhớ. Họ có thể thay đổi trạng thái và cũng có quyền truy cập vào lịch sử của nó. Ví dụ sau đây chứng minh điều này:

Số biến = 1; hàm tăng() (
trả về số++;
) // biến toàn cục được thay đổi: number = 2
tăng();

Không có điều kiện

Các hàm hoặc thành phần không trạng thái thực hiện các tác vụ như thể chúng được chạy lần đầu tiên. Họ không tham chiếu hoặc sử dụng dữ liệu được tạo trước đó trong quá trình thực thi. Tình trạng không quốc tịch cung cấp tính minh bạch tham chiếu. Các hàm chỉ phụ thuộc vào các đối số của chúng và không có quyền truy cập hoặc cần biết bất cứ điều gì ngoài phạm vi của chúng. Hàm thuần túy không có trạng thái. Ví dụ:

Số biến = 1; hàm tăng(n) (
trả lại n + 1;
) // biến toàn cục KHÔNG được thay đổi: trả về 2
tăng(số);

Các ứng dụng phi trạng thái vẫn quản lý trạng thái. Tuy nhiên, chúng quay trở lại trạng thái hiện tại mà không thay đổi trạng thái trước đó. Đây là nguyên tắc của lập trình chức năng.

Tóm lại: điều kiện

Quản lý tài sản là quan trọng đối với bất cứ ai ứng dụng phức tạp. Các hàm hoặc thành phần trạng thái thay đổi trạng thái cũng như lịch sử của nó và khó kiểm tra và gỡ lỗi hơn. Các hàm không trạng thái chỉ dựa vào đầu vào của chúng để tạo ra đầu ra. Chương trình phi trạng thái trả về trạng thái mới thay vì sửa đổi trạng thái hiện có.

Thông tin trạng thái bổ sung có thể được tìm thấy tại các tài nguyên sau:

Tình trạng
Lợi ích của lập trình phi trạng thái
Các thành phần có và không có trạng thái, thiếu hướng dẫn sử dụng
Redux: Vùng chứa trạng thái có thể dự đoán được cho các ứng dụng JavaScript

Tính bất biến và khả năng thay đổi

Các khái niệm về tính bất biến và khả năng thay đổi trong JavaScript còn mơ hồ hơn so với một số ngôn ngữ lập trình khác. Tuy nhiên, bạn sẽ nghe nhiều về tính bất biến khi đọc về lập trình chức năng trong JS. Điều quan trọng là phải biết ý nghĩa của những thuật ngữ này theo nghĩa cổ điển và cách chúng được triển khai trong JavaScript. Các định nghĩa khá đơn giản:

bất biến

Nếu một đối tượng là bất biến thì giá trị của nó không thể thay đổi sau khi được tạo.

Có thể thay đổi

Nếu một đối tượng có thể thay đổi thì giá trị của nó có thể được thay đổi sau khi tạo.

Triển khai: Tính bất biến và khả năng thay đổi trong JavaScript

TRONG Chuỗi JavaScript và chữ số được thực hiện bất biến. Điều này thật dễ hiểu nếu chúng ta xem xét cách chúng ta làm việc với họ:

Var str = "Xin chào!";
var anotherStr = str.substring(2);
// kết quả: str = "Xin chào!" (đã không thay đổi)
// kết quả: anotherStr = "llo!" (dòng mới)

Sử dụng phương thức .substring() trên Hello! , chuỗi không thay đổi chuỗi gốc. Thay vào đó cô ấy tạo ra dòng mới. Chúng ta có thể xác định lại giá trị của str thành giá trị khác, nhưng khi chúng ta đã tạo Hello! , nó sẽ mãi mãi là Hello! .

Chữ số cũng không thay đổi được. Ví dụ sau sẽ luôn có kết quả tương tự:

Var ba = 1 + 2;
// kết quả: ba = 3

Trong mọi trường hợp, 1 + 2 không thể trở thành gì khác ngoài 3.

Điều này chứng tỏ rằng JavaScript có khả năng triển khai tính bất biến. Tuy nhiên, các nhà phát triển JS biết rằng ngôn ngữ này cho phép bạn thay đổi rất nhiều. Ví dụ, các đối tượng và mảng có thể thay đổi được. Hãy xem xét ví dụ sau:

Var mảng = ;
mảng.push(4);
// kết quả: mảng =

var obj = ( lời chào: "Xin chào" );
obj.name = "Jon";
// kết quả: obj = ( lời chào: "Xin chào", tên: "Jon" )

Trong những ví dụ này đối tượng nguồnđã thay đổi. Các đối tượng mới không được trả lại.

Để tìm hiểu thêm về tính có thể thay đổi trong các ngôn ngữ khác, hãy xem Đối tượng có thể thay đổi và không thể thay đổi.

Trong thực tế: Khả năng biến đổi trong JavaScript

Lập trình chức năng trong JavaScript đang phát triển tốt. Nhưng cốt lõi của nó, JS là một ngôn ngữ rất linh hoạt, bao gồm nhiều mô hình. Tính năng chính lập trình chức năng — bất biến. Khác ngôn ngữ chức năng sẽ đưa ra lỗi khi nhà phát triển cố gắng thay đổi một đối tượng bất biến. Vậy thì làm thế nào chúng ta có thể dung hòa được tính biến đổi vốn có của JS khi viết JS chức năng hoặc JS phản ứng chức năng?

Khi chúng ta nói về lập trình chức năng trong JS, từ "bất biến" được sử dụng rất nhiều, nhưng trách nhiệm của nhà phát triển là phải luôn ghi nhớ nó. Ví dụ: Redux dựa vào một cây trạng thái bất biến duy nhất. Tuy nhiên, bản thân JavaScript có khả năng sửa đổi đối tượng trạng thái. Để triển khai cây trạng thái bất biến, chúng ta cần trả về một đối tượng trạng thái mới mỗi khi trạng thái thay đổi.

Để minh họa khái niệm về vật có thể quan sát, hãy xem một ví dụ đơn giản: thay đổi kích thước cửa sổ trình duyệt. Trong bối cảnh này, những gì có thể quan sát được càng rõ ràng càng tốt. Việc thay đổi kích thước cửa sổ trình duyệt sẽ tạo ra một luồng sự kiện trong quá trình Thời kỳ nhất định thời gian (trong khi cửa sổ đang nhận đúng kích cỡ). Chúng ta có thể tạo một thứ có thể quan sát được và đăng ký nó để phản hồi một luồng các sự kiện thay đổi kích thước:

Ví dụ về mã ở trên chứng minh rằng khi kích thước cửa sổ thay đổi, chúng ta có thể giới hạn luồng có thể quan sát được và đăng ký các thay đổi của nó để phản hồi các giá trị mới trong bộ sưu tập. Đây là một ví dụ về một quan sát nóng.

Về sự hướng dẫn này

Sách tham khảo dành cho những người đã nắm vững kiến thức cơ bản về lập trình JavaScript.

Thư mục được tạo trên cơ sở thông tin được cung cấp trên trang web “Danh mục ngôn ngữ web” www.spravkaweb.ru.

Bởi vì tài nguyên này liên tục được bổ sung thông tin mới, Tải xuống phiên bản cập nhật sách tham khảo có thể được tìm thấy trong phần Tải xuống

Ngoài ra trên trang web còn có sách tham khảo về PHP, CSS, Perl, MySQL để tải xuống.

Một khớp sử dụng HTML và JavaScript

. . . văn bản kịch bản

Thuộc tính ngôn ngữ

Thuộc tính thứ hai src

biến thành đơn:

Nhãn

Quy tắc viết kịch bản

Trước hết, chúng ta cần xem xét thẻ. Thẻ này được sử dụng để chèn tập lệnh vào mã HTML của trang. Định dạng của nó:

. . . văn bản kịch bản

Văn bản script được đặt bên trong thẻ

Thuộc tính ngôn ngữ cho phép bạn chỉ định ngôn ngữ lập trình mà tập lệnh được viết.

Giá trị mặc định là "JavaScript".

trình duyệt web IE kịch bản viết bằng ngôn ngữ VBScript, tương ứng với giá trị của thuộc tính "VBScript".

Navigator cho phép bạn đặt phiên bản trình thông dịch JavaScript:

Điều này có thể có ích trong trường hợp bạn sử dụng tùy chọn Ngôn ngữ JavaScript, dành riêng cho một phiên bản cụ thể.

Bảng sau đây hiển thị các phiên bản của trình thông dịch JavaScript và sự tương ứng của chúng phiên bản khác nhau Hoa tiêu:

Thuộc tính thứ hai src dùng để chỉ định địa chỉ của tệp chứa tập lệnh.

Trong trường hợp này, thẻ được ghép nối thường biến thành một thẻ duy nhất:

js- phần mở rộng tiêu chuẩn cho các tập tin JavaScript.

Nhưng điều gì sẽ xảy ra nếu trình duyệt Web không hỗ trợ script? (Ví dụ như vậy quá phiên bản cũ chương trình hoặc người dùng đã tắt hỗ trợ tập lệnh trong cài đặt bảo mật.) Trình duyệt Web sẽ bỏ qua thẻ và hiển thị văn bản tập lệnh.

Để tránh điều này, bạn nên đặt tập lệnh bên trong thẻ trong nhận xét.

Tuy nhiên, một số phiên bản của Navigator không “nhìn thấy” tập lệnh trong trường hợp này, mặc dù theo hướng dẫn kỹ thuật Bản thân Netscape nên như vậy. Vì vậy thủ thuật này chỉ áp dụng cho Internet Explorer.

Ngoài ra, bạn có thể sử dụng .

Thẻ này được hỗ trợ bởi Internet Explorer và Navigator:

. . . Văn bản sẽ hiển thị nếu trình duyệt Web không hỗ trợ tập lệnh

Thẻ có thể được đặt ở bất cứ đâu trong văn bản của trang, thậm chí bên ngoài . Văn bản được đặt bên trong thẻ này sẽ được hiển thị thay vì toàn bộ trang. Nghĩa là, người dùng trình duyệt Web bị tắt hỗ trợ tập lệnh sẽ chỉ nhìn thấy văn bản này trong cửa sổ và không thấy gì khác.

Mô hình Đối tượng Tài liệu

Cần lưu ý rằng JavaScript hỗ trợ cái gọi là các lớp và đối tượng bên ngoài được xác định bởi các chương trình khác.Trang Web mà bạn xem trong cửa sổ trình duyệt Web có thể được mô tả như một tập hợp các đối tượng. Giả sử nó bao gồm vật lớn"tài liệu tổng thể" và các đối tượng nhỏ hơn: "đoạn-1", "đoạn-2", "đoạn-1" và "hình". Bạn có thể truy cập các đối tượng này từ cùng một JavaScript.

Hình.MoveForward;Đoạn-1.Width = 80%;Đoạn-3.Show;

Tất nhiên, điều này đang được phóng đại quá mức, nhưng nguyên tắc là thế này.

Ví dụ, hãy xem xét kịch bản:

var d;d=new Date();document.write(d.toString());

Tài liệu tài liệu- đây là “tài liệu tổng thể” của chúng tôi. MỘT viết- phương thức của nó chèn văn bản được truyền dưới dạng tham số vào vị trí hiện tại của tài liệu HTML.

Tập hợp các đối tượng mô tả một trang web, với tất cả các phương thức và thuộc tính của chúng, được gọi là mô hình đối tượng tài liệu. Một công nghệ để tạo một trang web, trong đó mã HTML thông thường được kết hợp với mã JavaScript và mã này sẽ điều khiển trang bằng cách sử dụng mô hình đối tượng, được gọi là HTML động (DHTML).

đối tượng tài liệu

phần tử hoạt động

alinkColor

Ví dụ:

bộ ký tự

chế độ tương thích

bộ ký tự mặc định

thiết kếChế độ

phần tử tài liệu

tập tinNgày tạo

tập tinNgày sửa đổi

Kích thước tập tin

tài liệu điện tử.hình ảnh

Sửa đổi lần cuối

màu sắc liên kết

vị trí

cha mẹWindow

Tương tự với document.embeds

giao thức

đọcState

người giới thiệu

bảo vệ

sự lựa chọn

bảng định kiểu

URLChưa được mã hóa

vlinkColor

Chiều rộng của tài liệu tính bằng pixel.

Của cải

Trước hết, cần lưu ý rằng đối tượng tài liệu tồn tại trong một phiên bản duy nhất cho toàn bộ tài liệu HTML. Nó luôn hiện diện nếu một tài liệu HTML tồn tại, do đó không cần phải tạo nó một cách cụ thể.

phần tử hoạt động

alinkColor

Đặt hoặc trả về màu của siêu liên kết đang hoạt động.

document.alinkColor[="(Color)"];

Các đối tượng neo là các biểu thức trong tài liệu HTML, được mô tả trong phần mô tả. Các đối tượng này được biểu thị trong URL bằng ký hiệu # nằm giữa URL trang và tên neo.

Ví dụ: Lấy số lượng neo trong tài liệu

var AnchorCount=document.anchors.length

Thuộc tính applet cho phép bạn truy cập các applet java có trong tài liệu.

Đặt hoặc trả về màu nền của trang. Trong IE nó chỉ hoạt động chính xác nếu màu trang được đặt bằng thuộc tính BGCOLOR.

Đối tượng này có nhiều thuộc tính chính để kiểm soát sự xuất hiện của trang. Để truy cập các thuộc tính của nó, tốt hơn là sử dụng biểu thức document.body.

Thuộc tính này đặt mã hóa được trình duyệt sử dụng để hiển thị trang hiện tại. Chỉ có IE được sử dụng.

bộ ký tự

Thuộc tính này đặt mã hóa được trình duyệt sử dụng để hiển thị trang hiện tại. Chỉ sử dụng NN.

chế độ tương thích

Internet Explorer 6 đã giới thiệu một thuộc tính mới của đối tượng tài liệu có tên là compatMode. Nhờ thuộc tính này (nhân tiện, nó ở chế độ chỉ đọc), chúng tôi có thể xác định chế độ nào hiện được bật - BackCompat (IE 4.x–IE 5.x) hoặc CSS1Compat (IE 6). Dựa trên giá trị của thuộc tính này, ví dụ, chúng ta có thể chỉ định các giá trị khác nhau Thuộc tính CSS chiều rộng, lề hoặc phần đệm:

if (document.getElementById)(oBlock = document.getElementById("mydiv");oBlock.style.width = ((document.compatMode) && (document.compatMode == "CSS1Compat")) ? "200px" : "250px" ;)

bộ ký tự mặc định

Thuộc tính này đặt mã hóa được trình duyệt sử dụng để hiển thị trang hiện tại. Không có sự khác biệt giữa charset và defaultCharset, nhưng nếu bạn tạm thời thay đổi thuộc tính charset trong tập lệnh, bạn có thể sử dụng defaultCharset để khôi phục bộ ký tự gốc.

thiết kếChế độ

Thuộc tính này được sử dụng khi trình duyệt IE hoạt động như một thành phần của ứng dụng khác, tình huống nàyđược mô tả ở đây Nó cho phép/cấm thay đổi mã HTML của trang hiện tại; trong điều kiện bình thường, thuộc tính này không có hiệu lực.

phần tử tài liệu

Bất cứ khi nào cần tải dữ liệu yêu cầu plug-in ứng dụng để phát hoặc hiển thị trên màn hình, hãy sử dụng bộ mô tả. Thuộc tính document.embeds là cách duy nhất để xác định các bộ mô tả đó được thêm vào tài liệu

var count=document.embeds.length

Thuộc tính này, khi được đặt thành true, cho phép sử dụng các thuộc tính đối tượng mới mà bạn đã thêm khi thực thi tập lệnh.

Đặt hoặc trả về màu văn bản. Giá trị mặc định là #000000.

tập tinNgày tạo

Trả về ngày tạo của tệp tài liệu HTML ở định dạng mm/dd/yyyy, chỉ đọc.

tập tinNgày sửa đổi

Trả về ngày thay đổi cuối cùng Tệp tài liệu HTML ở định dạng mm/dd/yyyy, chỉ đọc.

Kích thước tập tin

Trả về kích thước tệp của tài liệu HTML hoặc hình ảnh đồ họa.

Trả về một mảng các đối tượng biểu mẫu. Phần tử đầu tiên của mảng document.forms là một liên kết đến biểu mẫu đầu tiên được xác định trong tài liệu.

Trả về một mảng các đối tượng khung. Phần tử đầu tiên của mảng document.frames là tham chiếu đến khung đầu tiên được xác định trong tài liệu.

Đặt hoặc trả về chiều cao của cửa sổ hoặc khung hiện tại bằng pixel, tương ứng với thuộc tính ScrollHeight của IE.

tài liệu điện tử.hình ảnh

Sửa đổi lần cuối

Trả về ngày tài liệu được sửa đổi lần cuối dưới dạng chuỗi.

Đây là một mảng các lớp nằm trong tài liệu

màu sắc liên kết

Đặt hoặc trả về màu của siêu liên kết trong tài liệu. Trong IE nó chỉ hoạt động chính xác nếu màu của các liên kết thạch cao được đặt bởi thuộc tính LINK.

vị trí

Cài đặt mới địa chỉ URL thuộc tính vị trí sẽ tải trang nằm ở địa chỉ này

Thuộc tính chỉ đọc, trả về địa chỉ của trang hiện đang được tải trong trình duyệt.

cha mẹWindow

Thuộc tính document.parentWindow trả về một tham chiếu đến đối tượng cửa sổ chứa tài liệu hiện tại.

Tương tự với document.embeds

giao thức

Trả về phiên bản giao thức được sử dụng để truy cập tài liệu hiện tại

đọcState

Trả về trạng thái hiện tại của tài liệu.

người giới thiệu

Trả về địa chỉ Internet của trang Web mà người dùng đã điều hướng đến trang hiện tại. Nếu người dùng điều hướng đến nó bằng cách gõ địa chỉ vào trình duyệt Web, một chuỗi trống sẽ được trả về.

Trả về một mảng gồm tất cả các phần tử SCRIPT có trong tài liệu. Không chỉ có thể xem mảng mà còn có thể thêm/xóa các phần tử.

bảo vệ

Thuộc tính này cung cấp thông tin về loại bảo mật, nếu có, được áp dụng trong tài liệu hiện tại.

sự lựa chọn

Thuộc tính document.selection trả về một đối tượng lựa chọn, nội dung của nó được hiển thị trong cửa sổ trình duyệt dưới dạng vùng chọn của nội dung văn bản. Việc lựa chọn này có thể được thực hiện bởi người dùng hoặc bằng tập lệnh trong đối tượng TextRange

bảng định kiểu

Trả về tiêu đề của trang Web được chỉ định trong thẻ

Đặt hoặc trả về địa chỉ Internet của trang Web hiện tại.

URLChưa được mã hóa

Thuộc tính trả về chuỗi URL dưới dạng mã. Điều này có nghĩa là tất cả các ký tự không phải chữ và số (chỉ có nghĩa là số và chữ cái trong bảng chữ cái Latinh) sẽ được mã hóa lại thành biểu diễn URL của chúng. tức là dấu % và mã thập lục phân ký tự (ví dụ: khoảng trắng sẽ có dạng %20).

vlinkColor

Đặt hoặc trả về màu của siêu liên kết đã truy cập trong tài liệu. Trong IE nó chỉ hoạt động chính xác nếu màu của siêu liên kết đã truy cập được đặt thành thuộc tính VLINK.

Chiều rộng của tài liệu tính bằng pixel.

phương pháp

Phương pháp này được thiết kế để xóa tài liệu hiện tại khỏi cửa sổ trình duyệt.

Làm cho trang Web cập nhật ngay nội dung của nó sau khi sử dụng các phương pháp ghi. Phương thức không chấp nhận tham số và không trả về giá trị.

tạoAttribution()

createAttribution("Tên thuộc tính")

Tạo một đối tượng thuộc tính và trả về một tham chiếu đến nó. Khi gọi phương thức, chỉ có tên của thuộc tính được chỉ định, do đó tập lệnh sẽ gán một giá trị cho thuộc tính nodeValue, sau đó thuộc tính mới được thêm vào phần tử hiện có bằng cách sử dụng tham chiếu đối tượng thuộc tính *Returns:

setAttributionNode

var newAttr = document.createAttribution("width");newAttr.nodeValue = "80%";document.getElementById("myTable").setAttributionNode(newAttr);

tạoElement()

createElement("Tên xử lý")

Tạo một đối tượng thuộc tính cho bất kỳ bộ mô tả HTML (hoặc XML) nào được chỉ định làm tham số. Đối tượng này không chính thức là một phần của mô hình đối tượng của tài liệu hiện tại vì nó chưa phải là một phần của tài liệu. Nhưng phương pháp nàyđược sử dụng để gọi đối tượng phần tử cuối cùng sẽ được đặt trong tài liệu.

phần tửFromPoint()

elementFromPoint((X), (Y))

getElementById()

getElementById((Tên phần tử))

Trả về phần tử có tên được truyền dưới dạng tham số. Tên thành phần trang được chỉ định bởi thuộc tính ID. Phương thức này lấy một tham số duy nhất - tên của thành phần trang.

getSelection()

Trả về một chuỗi chứa văn bản được người dùng chọn trên trang. Phương thức không chấp nhận tham số.

viết((Văn bản))

Viết văn bản hoặc mã HTML được truyền dưới dạng tham số cho vị trí hiện tại trong tài liệu.

viếtLn()

writeLn((Văn bản))

Tương tự như viết, nhưng thêm dấu xuống dòng và dòng cấp dữ liệu ở cuối.

Bộ sưu tập đồ vật

Bộ sưu tập là một loại mảng các đối tượng, được lập chỉ mục không chỉ bằng số của các phần tử mà còn theo tên của chúng, đồng thời có các thuộc tính và phương thức. Bộ sưu tập này khác với mảng kết hợp chính xác bởi sự hiện diện của các thuộc tính và phương thức, tức là một bộ sưu tập là một đối tượng trong chính nó.

Ví dụ, hãy xem xét bộ sưu tập hình ảnh mà đối tượng tài liệu bao gồm. Bạn có thể truy cập các phần tử riêng lẻ của nó bằng số sê-ri hoặc tên duy nhất.

document.images.item(1)document.images("iamge1")

Lưu ý rằng chúng tôi chỉ ra chỉ mục của phần tử bộ sưu tập không phải bằng hình vuông mà bằng dấu ngoặc đơn bởi vì nó thực sự là một đối số cho hàm phương thức mục được tất cả các bộ sưu tập hỗ trợ. Tên của phương pháp này có thể được bỏ qua.

document.images(1)document.images("image1")

Tất cả các thành phần của trang Web đều được đánh số theo thứ tự chúng xuất hiện trong mã HTML. Và tên duy nhất được chỉ định bởi một thuộc tính đặc biệt NHẬN DẠNG, có sẵn trong hầu hết các thẻ.

Đối với một số thẻ (đặc biệt và ) cũng có sẵn Thuộc tính TÊN, thực hiện chức năng tương tự như ID.

Bộ sưu tập all đại diện cho tất cả các thành phần của một trang Web, không có ngoại lệ, bao gồm cả hình ảnh. Các thành phần của bộ sưu tập này có thể được gọi bằng số (chúng được đánh số theo thứ tự xuất hiện trong mã HTML) hoặc theo tên.

document.all(8)document.all("iamge1")

Thuộc tính ID yêu cầu tên của tất cả các thành phần phải là duy nhất nhưng chỉ mang tính hình thức. Trong thực tế, có thể có hai hoặc nhiều phần tử trên trang có cùng tên. Trong trường hợp này, bạn sẽ cần chỉ định chỉ mục thứ hai

document.all("hình ảnh1", 2)

hoặc biểu hiện tài liệu.all("image1") sẽ trả về một tập hợp tất cả các hình ảnh có tên image1.

Ngoài ra, tất cả các bộ sưu tập đều có thuộc tính độ dài, xác định số phần tử trong bộ sưu tập. Cần lưu ý rằng các phần tử của bộ sưu tập được đánh số từ 0, vì vậy phần tử cuối cùng của nó sẽ có số độ dài-1.

Một số bộ sưu tập có thể có các phương pháp để thêm và xóa các phần tử cũng như các mục đích khác.

Các đối tượng phụ và bộ sưu tập của đối tượng tài liệu

Đối tượng tài liệu chứa nhiều đối tượng phụ và bộ sưu tập bên trong nó. Bảng sau liệt kê các thuộc tính trả về tham chiếu đến chúng và cung cấp mô tả về các đối tượng và bộ sưu tập tương ứng.

Bộ sưu tập tất cả Nó có phương pháp bổ sung thẻ, cho phép bạn lọc các mục trong bộ sưu tập theo thẻ của chúng. Phương thức này lấy giá trị chuỗi của thẻ mong muốn làm tham số.

document.all.tags("H1")

Phương pháp tương tự được hỗ trợ bởi bộ sưu tập liên kết.

Tôi cũng muốn đề cập đến hai phương pháp được Internet Explorer hỗ trợ kể từ phiên bản 5.0. Đây là những phương pháp getElementByName Và getElementByTagName. Cái đầu tiên trả về một tập hợp các phần tử có giá trị thuộc tính TÊNđược truyền dưới dạng tham số. Vì thuộc tính TÊNĐược dùng trong HTML hiện đại rất hiếm khi, lợi ích của phương pháp này là nhỏ. Phương thức thứ hai trả về một tập hợp các phần tử được tạo bởi thẻ được truyền dưới dạng tham số.

document.getElementByName("someimage") document.getElementByTagName("H1")

Truy cập các phần tử trang

Một đối tượng tài liệu có một số phương pháp hữu ích có thể được sử dụng trong các tập lệnh. Nhưng ý nghĩa chính của nó là cung cấp quyền truy cập vào các phần tử riêng lẻ của một trang Web. Làm thế nào bạn có thể truy cập vào một phần tử riêng lẻ của một trang? Trước hết, thông qua các bộ sưu tập. Ví dụ, một bộ sưu tập tất cả:

document.all("image1").outerHTML

Hoặc thông qua bộ sưu tập hình ảnh:

document.images("image1").outerHTML

all("image1").outerHTMLimages("image1").outerHTML

NN không cho phép bạn làm điều đó. Nó yêu cầu một liên kết bắt buộc tới tài liệu. Ngoài ra, nó không hỗ trợ bộ sưu tập tất cả.

document.images("image2").src

Tên của một thành phần trang Web được chỉ định bằng các thuộc tính NHẬN DẠNG Và TÊN. Nếu mọi thành phần trang đều có tên duy nhất, thì bạn có thể sử dụng cái gọi là khiếu nại trực tiếp tới các phần tử. Nghĩa là, truy cập nó không phải như một phần tử của bộ sưu tập mà là đối tượng riêng biệt. Điều này hoạt động trong cả IE và NN.

image1.outerHTMLlayer1.top

Truy cập trực tiếp nhanh hơn truy cập thông qua bộ sưu tập. Do đó, nên sử dụng nó trong mọi trường hợp không cần quyền truy cập đặc biệt vào các bộ sưu tập và khi mỗi thành phần trang được truy cập từ tập lệnh có một tên duy nhất.

đối tượng vị trí

Một đối tượng vị trí chứa thông tin về vị trí của tài liệu hiện tại, tức là. địa chỉ internet của anh ấy. Nó cũng có thể được sử dụng để di chuyển sang tài liệu khác và tải lại tài liệu hiện tại.

Thuộc tính của đối tượng vị trí

Phương thức đối tượng vị trí

Sử dụng đối tượng vị trí, bạn có thể tải một tài liệu khác thay cho tài liệu hiện tại. Để thực hiện việc này, chỉ cần gán giá trị của địa chỉ Internet mới cho thuộc tính href.

document.location.href = "http://www.spravkaweb.ru";

Người dùng IE cũng có thể sử dụng phương pháp giao phó:

document.location.sign("http://www.spravkaweb.ru");

Nếu bạn muốn thay thế hoàn toàn tài liệu hiện tại để ngay cả địa chỉ của nó cũng không xuất hiện trong danh sách lịch sử, hãy sử dụng phương pháp thay thế:

document.location.replace("http://www.spravkaweb.ru");

đối tượng phong cách

Giống như tất cả các đối tượng khác, phong cách

phong cách phong cách

Thuộc tính và phương thức

Giống như tất cả các đối tượng khác, style hỗ trợ một số thuộc tính và phương thức. Chúng có thể được chia thành hai nhóm:

Các thuộc tính của nhóm đầu tiên nhìn chung tương tự như các thuộc tính kiểu tương ứng và có tên gần như giống nhau, ngoại trừ các ký hiệu "-" bị loại bỏ, bởi vì không tuân theo quy ước đặt tên JavaScript và các chữ cái đầu tiên của tất cả các từ tạo nên tên thuộc tính ngoại trừ tên đầu tiên được viết hoa. Bảng sau đây hiển thị các ví dụ về chuyển đổi tên thuộc tính kiểu thành tên của thuộc tính đối tượng kiểu để đặt kiểu của phần tử.

Bằng cách tương tự, bạn có thể chuyển đổi tất cả các thuộc tính kiểu thành các thuộc tính của đối tượng kiểu. Tất cả các thuộc tính không phải kiểu của đối tượng kiểu được liệt kê trong bảng bên dưới. Đối tượng này cũng có các phương thức getAttribution, RemoveAttribution và setAttribution. Nhưng những điều này thuộc tính bổ sung và các phương thức chỉ được IE hỗ trợ bắt đầu từ 4.0

Làm việc với đối tượng kiểu

Đối tượng kiểu cho phép bạn thay đổi kiểu của bất kỳ thành phần nào trên trang Web bằng cách chỉ định tài sản mong muốn giá trị cần thiết.

đoạn1.style.fontSize = 7;

Bạn có thể thay đổi kích thước hình học của một phần tử:

image1.style.height = "100mm";image1.style.width = "120mm";

và vị trí của nó:

iamge1.style.top = "200px";image1.style.left = "50px";

Lưu ý rằng chúng ta gán các giá trị chuỗi thuộc tính của các tham số hình học, cho biết đơn vị đo. Điều này không thân thiện lắm về mặt tính toán, vì vậy đối tượng kiểu cung cấp các thuộc tính điểm ảnh, nhận và trả lại giá trị số tính bằng pixel:

image1.style.pixelHeight = 400;iamge1.style.pixelLeft +=5;

Bạn cũng có thể sử dụng thuộc tính tư thế, trả về và chấp nhận các giá trị số theo đơn vị mà các giá trị này được chỉ định trong định nghĩa kiểu.

nheight = image1.style.posHeight; // Giá trị tính bằng milimétnwidth = image1.style.posWidth; // Giá trị tính bằng pixel

Bạn có thể sử dụng các phương pháp getAttribution, setAttribution Và loại bỏThuộc tínhđể nhận và đặt giá trị cũng như xóa bất kỳ thuộc tính kiểu nào:

đoạn1.style.setAttribution("borderBottomWidth", 5, false);paragraph1.style.removeAttribution("borderTopWidth", false);

Đối tượng kiểu trong Internet Explorer

Làm thế nào để bạn truy cập vào đối tượng phong cách? Internet Explorer cung cấp ba thuộc tính cho việc này: phong cách, phong cách hiện tại Và thời gian chạyStyle.

Thuộc tính đầu tiên cho phép bạn truy cập kiểu được nhúng trong thẻ phần tử bằng thuộc tính STYLE:

Bất kỳ văn bản nào

someColor = par1.style.color;

Biểu thức trên sẽ đưa vào một biến một số màu sắc giá trị thuộc tính màu sắc kiểu phần tử nội tuyến, tức là "màu xanh lá".

someFontSize = par1.style.fontSize;

Biểu thức này sẽ trở lại vô giá trị, ngay cả khi ở đâu đó trong biểu định kiểu thuộc tính cỡ chữđược xác định cho phần tử này. Và tất cả chỉ vì lợi ích của tài sản phong cách không vượt ra ngoài thành phố được xây dựng sẵn.

Để có được kiểu của một phần tử có tính đến cả kiểu nội tuyến, biểu định kiểu và thuộc tính thẻ, hãy sử dụng thuộc tính phong cách hiện tại:

Bất kỳ textsomeColor = par1.currentStyle.color;someBColor = par1.currentStyle.backgroundColor;someFontSize = par1.currentStyle.fontSize;someOther = par1.currentStyle.textDecoration;

Giả sử rằng ở đâu đó trong biểu định kiểu có một thuộc tính được xác định cho phần tử này màu nền, bằng "teal" và trang trí văn bản không được xác định chút nào. Các biểu thức này sẽ trả về các giá trị sau: giá trị đầu tiên là "xanh", giá trị thứ hai là "mòng két", giá trị thứ ba là "lớn nhất" (hoặc "7") và giá trị thứ tư là "không"? những thứ kia. Giá trị mặc định cho thuộc tính kiểu này.

Nếu bạn thay đổi bất kỳ thuộc tính nào của đối tượng style thì thuộc tính tương tự của đối tượng currentStyle sẽ thay đổi và ngược lại. Chi tiết duy nhất là nếu bạn thay đổi bất kỳ thuộc tính currentStyle nào và sau đó truy cập ngay vào thuộc tính đó, giá trị cũ sẽ được trả về. Nghĩa là, phải mất một khoảng thời gian giữa việc gán giá trị và áp dụng nó cho phần tử.

Tài sản thời gian chạyStyle khá lạ. Nó trả về một tham chiếu đến đối tượng thời gian chạyStyle, gần giống như phong cách hiện tại, nhưng việc gán giá trị mới cho thuộc tính của nó không ảnh hưởng đến các thuộc tính kiểu tương tự. Nghĩa là, bạn có thể ghi đè các thuộc tính kiểu thời gian chạyStyle và các thuộc tính kiểu tương ứng (nhưng không phong cách hiện tại) sẽ không thay đổi.

đối tượng styleSheet và bộ sưu tập styleSheets

Đối tượng tài liệu IE có một bộ sưu tập styleSheets tích hợp sẵn mà bạn có thể sử dụng để truy cập các biểu định kiểu tài liệu riêng lẻ. MỘT bàn riêng các kiểu được thể hiện bằng một đối tượng styleSheet:

địa chỉ = document.styleSheets(1).href;

Ba thuộc tính của đối tượng style sheet sẽ hữu ích cho chúng ta.

Điều thứ nhất là href, đại diện cho địa chỉ Internet của tệp biểu định kiểu bên ngoài. Bạn có thể thay đổi URL này để tải một biểu định kiểu khác.

Thứ hai - tàn tật, cho phép hoặc ngăn trình duyệt Web sử dụng bảng này để định dạng tài liệu. Xin lưu ý rằng trong trong trường hợp này false cho phép bảng được sử dụng và true sẽ vô hiệu hóa nó.

Và tài sản cuối cùng - kiểu- chỉ là mối quan tâm về mặt lý thuyết đối với chúng tôi: nó chỉ định loại biểu định kiểu, đối với IE luôn là "text/css".

Đối tượng kiểu trong Bộ điều hướng. Kiểu JavaScript

Bộ điều hướng chỉ hỗ trợ tham chiếu trực tiếp bằng mã định danh cho các đối tượng lớp và không hỗ trợ các bộ sưu tập tất cả. Có và hỗ trợ thuộc tính NHẬN DẠNG nó được triển khai bình thường, chủ yếu để gán kiểu cho các phần tử. Nhưng đối tượng tài liệu Bộ điều hướng cung cấp bốn thuộc tính rất mạnh để làm việc với các kiểu.

Tài sản các lớp học sẽ cho phép bạn truy cập vào một kiểu được đặt tên riêng:

document.classes.(Tên kiểu).(Tên thẻ)|all.(Tên thuộc tính)

Ở đây (Tên thẻ) có thể là tên của bất kỳ thẻ nào. Nếu bạn cần tạo kiểu cho tất cả các thẻ, hãy sử dụng từ tất cả.

Ví dụ: giả sử bạn xác định một kiểu trong biểu định kiểu của mình:

Somestyle (màu sắc: xanh lá cây)

Sau đó, trong mã script, bạn có thể truy cập nó:

document.classes.somestyle.all.fontFamily = "Arial";

Tương tự, bạn có thể xác định kiểu cho một thẻ cụ thể:

P.somestyle (màu: xanh lá cây)document.classes.somestyle.P.fontFamily = "Arial";

Đổi lại, thuộc tính ids sẽ cho phép bạn truy cập vào kiểu được gán cho một ID cụ thể:

document.ids.(Mã định danh).(Tên thuộc tính)

Ví dụ:

#someid (màu: xanh)document.ids.someid.fontFamily = "Arial";

Nhưng nếu bạn ghi đè kiểu của một số thẻ thì sao? Trong trường hợp này, hãy sử dụng thuộc tính thẻ:

document.tags.(tag).(Tên thuộc tính)

Ví dụ:

H1 (màu: xanh lá cây)document.tags.H1.fontFamily = "Chuyển phát nhanh";

Điều gì sẽ xảy ra nếu bạn cần thay đổi kiểu của một phần tử nằm bên trong tiêu đề cấp hai? Có một tài sản cho việc này theo ngữ cảnh:

document.contextual((Ngữ cảnh 1)[, (Ngữ cảnh 2)[, ...]]).(Tên thuộc tính)

Sau đó, đối với trường hợp chúng tôi đã mô tả:

document.contextual(document.tags.H2, document.tags.B).fontStyle= "xiên";

tương tự như việc chỉ định trong một biểu định kiểu

H2 B (kiểu chữ: xiên)

Nhưng nếu bạn nghĩ rằng bạn có thể tự động thay đổi giao diện của các thành phần trang trong Bộ điều hướng bằng cách thay đổi kiểu của chúng thì bạn đã nhầm lẫn một cách đáng buồn. Trong thực tế, Navigator chỉ cần đối tượng kiểu để hỗ trợ một loại biểu định kiểu mới, được gọi là kiểu JavaScript.

Kiểu JavaScript khác với kiểu thông thường ở chỗ chúng giống với tập lệnh nhất. Thực ra đây là những kịch bản. Hãy xem hai ví dụ: biểu định kiểu thông thường và biểu định kiểu JavaScript:

P (màu: xanh lam).bigtext (cỡ chữ: 72pt; độ dày phông chữ: đậm nhất)H1 B (trang trí văn bản: gạch chân)

Đây là một style sheet thông thường. Bây giờ chúng ta hãy chuyển đổi nó thành một style sheet JavaScript:

document.tags.P.color = "blue";width (document.classes.bigtext.all) ( fontSize = "72pt"; fontWeight = "boldest"; )document.contextual(document.tags.H1, document.tags. B).textDecoration = "gạch chân";

Bây giờ bạn có thể thấy biểu định kiểu JavaScript giống với tập lệnh như thế nào. Cũng lưu ý rằng trong trường hợp này thuộc tính kiểu bắt buộc, bởi vì nó chỉ định loại biểu định kiểu.

Trong tất cả các ví dụ trước đây về Bộ điều hướng, chúng tôi luôn cung cấp một tham chiếu đến đối tượng tài liệu. Nhưng nó có thể được bỏ qua trong các biểu định kiểu JavaScript.

tags.P.color = "blue";width (classes.bigtext.all) ( fontSize = "72pt"; fontWeight = "boldest"; )contextual(tags.H1, tags.B).textDecoration = "underline";

đối tượng cửa sổ

Đối tượng cửa sổ đại diện cho cửa sổ trình duyệt Web hiện tại hoặc một khung riêng lẻ nếu cửa sổ được chia thành các khung.

Trả về true nếu cửa sổ hiện tại bị đóng. Có thể sử dụng khi làm việc với nhiều cửa sổ.

trạng thái mặc định

Thông báo mặc định hiển thị trên thanh trạng thái của cửa sổ.

tài liệu

chiều cao bên trong

Trả về chiều cao của vùng máy khách của cửa sổ (không có viền, menu, thanh công cụ) tính bằng pixel.

chiều rộng bên trong

Trả về chiều rộng của vùng máy khách của cửa sổ (không có viền, menu, thanh công cụ) tính bằng pixel.

Chỉ NN được hỗ trợ bắt đầu từ 4.0

Trả về số lượng khung hình.

vị trí

thanh vị trí

Trả về một tham chiếu đến đối tượng thanh địa chỉ của cửa sổ Điều hướng (còn gọi là Thanh công cụ Vị trí). Thuộc tính duy nhất của đối tượng này, hiển thị, sẽ cho phép bạn hiển thị hoặc ẩn nó; giá trị true của thuộc tính này hiển thị thanh địa chỉ, false sẽ xóa nó.

Chỉ NN được hỗ trợ bắt đầu từ 4.0

Trả về tên của cửa sổ hoặc khung.

hoa tiêu

chiều cao bên ngoài

Trả về tổng chiều cao của cửa sổ (có viền, menu, thanh công cụ) tính bằng pixel.

Chỉ NN được hỗ trợ bắt đầu từ 4.0

chiều rộng bên ngoài

Trả về toàn bộ chiều rộng của cửa sổ (có viền, menu, thanh công cụ) tính bằng pixel.

Chỉ NN được hỗ trợ bắt đầu từ 4.0

trangXOffset

Trả về khoảng cách theo chiều ngang giữa vị trí cửa sổ hiện tại và đường viền bên trái của tài liệu. Khi cuộn nội dung của cửa sổ sang bên phải, giá trị của thuộc tính này sẽ tăng lên và sang bên trái thì giá trị của thuộc tính này sẽ giảm đi.

Chỉ NN được hỗ trợ bắt đầu từ 4.0

trangYOffset

Trả về khoảng cách theo chiều dọc giữa vị trí cửa sổ hiện tại và đường viền bên trái của tài liệu. Khi cuộn nội dung của cửa sổ xuống dưới, giá trị của thuộc tính này tăng lên và khi cuộn lên thì giá trị của thuộc tính này giảm xuống.

Chỉ NN được hỗ trợ bắt đầu từ 4.0

thanh cá nhân

Chỉ hỗ trợ Navigator từ 4.0

màn hìnhTrái

Trả về tọa độ ngang của bên trái góc trên cùng cửa sổ.

màn hình hàng đầu

Trả về tọa độ dọc của góc trên bên trái của cửa sổ.

Chỉ hỗ trợ IE 5.0 trở lên

Tọa độ ngang của góc trên bên trái của cửa sổ.

Chỉ NN được hỗ trợ bắt đầu từ 4.0

Tọa độ dọc của góc trên bên trái của cửa sổ.

Chỉ NN được hỗ trợ bắt đầu từ 4.0