Many things can be changed. For example, you can freely add and remove properties (fields) of objects after they
have been created. And you can directly create objects, without creating an object factory (e.g., a class) first.
Variables and object properties can always hold values of any type.
Functional and object-oriented
partial application via bind(), built-in map() and reduce() for arrays, etc.) and object-oriented programming
(mutable state, objects, inheritance, etc.).
It fails silently
silently and automatically converts the values of arguments and operands: it initially couldn't throw exceptions.
Deployed as source code
being a flexible delivery format and of abstracting the differences between the engines. Two techniques are
used to keep file sizes small: compression (mainly gzip) and minification (making source code smaller by renaming variables, removing comments, etc.; see Chapter 32 for details).
Part of the web platform
(such as Node.js), the more obvious it becomes.
pageX and pageY:
Relative to the top left of the fully rendered content area in the browser.
This reference point is below the url bar and back button in the upper left.
This point could be anywhere in the browser window and can actually change location
if there are embedded scrollable pages embedded within pages and the user moves a scrollbar.
screenX and screenY:
Relative to the top left of the physical screen/monitor, this reference point only moves
if you increase or decrease the number of monitors or the monitor resolution.
clientX and clientY:
Relative to the upper left edge of the content area (the viewport) of the browser window.
This point does not move even if the user moves a scrollbar from within the browser.
the browser manipulates a page.
When the page loads, it is called an event. When the user clicks a button, that click too
is an event. Other examples include events like pressing any key, closing a window,
resizing a window, etc.
onclick Event Type This is the most frequently used event type which occurs when a user clicks
the left button of his mouse. You can put your validation, warning etc., against this event type.
Your server sends some data to the visitor's browser in the form of a cookie.
The browser may accept the cookie. If it does, it is stored as a plain text record on the
visitor's hard drive. Now, when the visitor arrives at another page on your site,
the browser sends the same cookie to the server for retrieval. Once retrieved, your
server knows/remembers what was stored earlier.
Cookies are a plain text data record of 5 variable-length fields:
Expires: The date the cookie will expire. If this is blank, the cookie will expire when
the visitor quits the browser. Domain: The domain name of your site. Path: The path to the
directory or web page that set the cookie. This may be blank if you want to retrieve the cookie
from any directory or page. Secure: If this field contains the word "secure", then the cookie may
only be retrieved with a secure server. If this field is blank, no such restriction exists.
Name=Value: Cookies are set and retrieved in the form of key-value pairs.
The simplest way to create a cookie is to assign a string value to the document.cookie object, which looks like this.
document.cookie = "key1=value1;key2=value2;expires=date";
Alert Dialog Box
An alert dialog box is mostly used to give a warning message to the users
Confirmation Dialog Box A confirmation dialog box is mostly used to take user's
consent on any option. It displays a dialog box with two buttons: OK and Cancel.
Prompt Dialog Box
The prompt dialog box is very useful when you want to pop-up a text box to get user input.
Thus, it enables you to interact with the user. The user needs to fill in the field and then click OK.
This operator specifies an expression to be evaluated without returning a value.
implement this functionality using the print function of window object.
< input type="button" value="Print" onclick="window.print()" / >
Objects are composed of attributes. If an attribute contains a function, it is considered to be a method of the object,
otherwise the attribute is considered a property.
The Number object represents numerical date, either integers or floating-point numbers. In general, you do not need to worry
about Number objects because the browser automatically converts number literals to instances of the number class.
The Boolean object represents two values, either "true" or "false".
data type with a number of helper methods.
The Array object lets you store multiple values in a single variable. It stores a fixed-size sequential collection of elements
of the same type. An array is used to store a collection of data, but it is often more
useful to think of an array as a collection of variables of the same type.
The math object provides you properties and methods for mathematical constants and functions.
Unlike other global objects, Math is not a constructor. All the properties and methods of Math
are static and can be called by using Math as an object without creating it.
Thus, you refer to the constant pi as Math.PI and you call the sine function as Math.sin(x), where x is the method's argument.
A regular expression is an object that describes a pattern of characters.
define methods that use regular expressions to perform powerful pattern-matching and search-and-replace functions on text.
Every web page resides inside a browser window which can be considered as an object.
A Document object represents the HTML document that is displayed in that window.
The Document object has various properties that refer to other objects which allow access to and modification of document content.
The browser provides access to a large hierarchy of objects for developers to manipulate.
Document Object Model (DOM)
document and related objects allow to access contents of the page, modify elements etc.
Most interaction with HTML is handled here.
Browser Object Model (BOM)
BOM is a pack of objects that allow to control the browser, e.g change current URL, access frames,
do background requests to server with XMLHttpRequest etc. Functions like alert,confirm,prompt also
belong BOM, they are provided by the browser.
The Browser Object Model
Collectively, these parts are known as the Browser Object Model, or the BOM. At the very top
of this browser hierarchy is the Window object. This represents the entire browser, with its toolbars,
menus, status bar, the page itself, and a whole lot more besides. Effectively, the Window IS the browser.
Allows you to access all your HTML elements. We'll go into more detail about the document object later.
Access information about browsing history. This object is of limited use since you can't get at which pages
a user has visited, just how many pages are in the browsing history. You can also access the methods history.back, history.forward and history.go. There's not many situations where you want to, though.
window.innerHeight and window.innerWidth
Gets the height and width of the available space on the page
Gets information about the browser screen.
You may think that screen is the same as innerHeight and innerWidth but they are not. As an example,
create a new HTML page from your template with SCRIPT tags in the HEAD section.
Used to gets information about the browser
Window Methods and Events
The Window object also has something called Methods. A method is a chunk of code that does a
window.open("popup.html", "PopUp", "toolbar=no,width=500,height=300");
Here are some more configuration options you can have:
left - the left position of the window in pixels
top - the top position of the window in pixels
height - height of the window's viewing area. Minimun height is 100 pixels
width - width of the window viewing area. Minimun width is 100 pixels
menubar - gets you the File, Edit, View, etc, menus at the top.
toolbar - gets you the standard toolbar: back, forward arrows, etc
location - gets you the Address bar, to type web address in
scrollbars - gets you scroll horizontal and vertical scroll bars
< a href="#" onClick="eAdd()">Link Text Here< /A>
The onClick part is something called an event.
The Document is another Window object you can manipulate. It's quite a powerful object as it refers to
just about all the elements you can have on a web page (forms, links, images, text, HTML code, etc).
The Document Object Model
The Document Object Model is a tree structure of various elements of HTML
The <html> is the ancestor of all the other elements; in other words, all the other elements are descendants of <html>.
The <head> and <body> elements are not only descendants, but children of <html>, as well.
Likewise, in addition to being the ancestor of <head> and <body>, <html> is also their parent.
The <p> elements are children (and descendants) of <div>, descendants of <body> and <html>, and siblings of each other <p> element