JavaScript elementary tutorial (Lesson 3) _ basic knowledge

JavaScript elementary tutorial (Lesson 3) This course aims to call the target name. In this example, the window name is yer_new_window.

Now that we have simply reviewed the href goal, we should start learning to open a window in JavaScript.

Window Opening in HTML is very common, but there are also some defects. the user's browser determines what the window looks like and you cannot determine the size and style of the window. Fortunately, JavaScript gives you such control.

Let's take a look at the reason:

Window. open ("URL", "name", "features ");

This statement opens a window with the first parameter URL you used for calling. Here is a URL, which can actually be written as a "http://www.jsfan.org/basic" or something similar.

The second parameter is the window name. This is like the name we see on the previous page. If you open a window with the same name, the URL will send the open statement to the window that has already been opened.

The third parameter, features, is a window with different features. This is an optional parameter. Let's first exercise the first two parameters.

Here are some examples of opening a window using JavaScript.

Click the following three links to see what will happen. Note: Do not close any of the three links before opening them. (The following three lines of text code are lost during the reprinting process and the link is invalid, so you cannot click it. I will fix it later ---- jsfan note)

This is the window named javascript_1.

Window named javascript_2.

Here is another HTML page that will go to javascript_1.

The first line of the statement:

Here's a window named into cript_1.

When you click this link, a window named javascript_1 is opened, and cript_window_1.html is displayed. Because the features parameter is optional, we ignore it first.

Note that onClick is used to open the window. You don't need to put window. open () in onClick to call the window, which is easy to do. Now you will see the windows. open () example in the script tag.

The second example is almost the same as the first one. It only opens a window with different names and calls it to different HTML pages.

Here's a window named using cript_2.

The third link puts a new HTML page in the first window. This is because the window you want to open has the same name as the first link: javascript_1.

Here's another HTML page going into javascript_1.

The magic is about to begin. Let's add the third parameter features to see what will happen.

OK. Let's join windows features and try again!
The third parameter in window. open () is a set of features that you want your window to display. If you are not sure about your parameters, use the default value of your browser.

However, if you specify some feature parameters, the window will appear as specified by the parameter setting value. Feature parameters appear in a comma-separated sequence.

For example, if you write:

Window. open ("some_url", "window_name", "location, menubar ");

You will get a window specifying the URL, window name, and menu bar (file, edit bar, and so on. Note that do not add any spaces to the string, which may cause some browsers to fail.

Let's take a look at another example:

Window. open ("some_url", "window_name", "location, height = 100, width = 100 ");

This will open a window with a height of 100 pixels each. Note that do not add spaces in the string again.

Here is a set of feature parameters that can be referenced in strings:

Menubar (menu bar)
This is a function line referenced in most software applications. It generally includes files, edits, and other entries.

Status)
This is the information bar located in the lower part of your window. When you move your mouse over a link, the URL of the link appears on this status bar. You can move the content displayed on the status bar to a rolling marquee. I am not planning to provide this example for you. If you want to know how to do it, try to solve it by yourself!

Scrollbars)
Scroll bars are allowed when necessary.

Resizable (reset)
When retuned parameters are listed, the window can be retuned. I often make mistakes when I pay attention to its spelling.

Width)
The window width expressed in pixels.

Height)
The window height expressed in pixels.

Toolbar)
Home button, among others.
Browser toolbar, including the back button, forward button, stop button, and HOME button.

Location)
You can enter the Region of the URL browser.

Directories (indicator Area)
For example, "What's new," "What's cool," in the Netscape Browser. Here are some examples of different types of windows.

Once you understand these examples, you can implement them in some of your windows. Details of the learning window

Now that you know how to open the window as you wish, you can learn how to operate in the window. Before that, you need to learn about the JavaScript Document Object Model (DOM). First, let's learn a little bit about "Object-based programming ".

Overview object-based programming

Object-based programming-especially the JavaScript version-is easy to understand. Its purpose is to organize information based on objects. JavaScript has a built-in Object Library. For example, a window is an object. Whenever I mention a default JavaScript library object, I will use upper case (Window ). The specific case (specific window) will be in lower case.

All objects have attributes used to describe them. Some of the properties of a window object are its name (the word on the status bar), the URL of the window file, and the window file itself. (Including single words, graphs, and hypertext links in Windows .)

In JavaScript, the default window object is window. Here you can learn how to get the properties of the default window.

Var the_status = window. status;

This is to say: Find the status attribute called window and call it to the variable the_status. The status feature of the window contains the words on the status bar. You can also set it in advance, like this:

Window. status = "I'm monkeying around! ";

This is an example of using status bars.

Who do we love?

"When you move the mouse over this link, the status bar changes ."

Object method:
In addition to attributes, the object also has a "method ". A "method" is a process that the object knows how to operate. For example, the window knows how to open another window:

Window. open ("URL," "name," "features "). It tells Javascript to open a new window in the window open mode.

Therefore, in the above example, an object's "method" is also called the method for obtaining a feature: Object Name, period, and then method. The main difference is that the method always follows a pair of Circular Arc containing the mode parameters. Even if a method does not call a parameter, the circular arc is required. Do you still remember this?

Var italic_hippy = hippy_monkey.italics ();

Yes! A string is actually an object, and italics () is a parameter of a character object.

You have read some examples of window methods but have not understood them yet. Calling alert and prompt in the dialog box is actually the method of window objects. If you call:

Window. alert ("Viva la primate! ");

You will see the dialog box and read "Viva la primate !" We can try this flickering window directly.

It looks silly. For better results, see call other windows.
Although it doesn't make much sense to blur or focus a window, sometimes you do need to move another window to the foreground. To use javascript For window communication, you need to reference the window.

Get and use a window reference

First, I open a window and assign a reference to it:

Var new_window = window. open ("hello.html", "html_name", "width = 200, height = 200 ");

This statement opens a small window and assigns it to the variable new_window as a reference to this window. A variable can contain numbers, strings, or references to an object. In this example, an object is a window. Now the new_window variable can be used as the current window. You can call the new_window method as you call the window method.

The following statement is an example of how to call new_window:

New_zookeeper blur ();

It serves the same purpose as window. blur () in the previous article.

Now let's take a look at the two links that move the new window to the foreground or to the background:

Bring it forward

Put it backward
Now we know that JavaScript includes default objects, such as Windows. Objects have attributes used to describe objects and methods used to describe actions of objects.

The property page of an object can be an object. For example, a window has an attribute called document, which is used to reference the actual HTML file in the window. The document attribute is an object. We have seen this example when talking about image swap. You can use the following statement for image replacement:

Change

The preceding statement means: Find the documentwindowin windows, find the src in the_image, and set it to invalid button_d.gif. This is because windows is an object, while images pages in a document are objects.

It seems complicated, but its structure is clear. The Document Object Model of JavaScript describes the hierarchical relationship between objects.

In this tutorial, we only see part of the level relationship. Most of the techniques that make your web page dynamic involve file objects. The file object is rich in content. In fact, we should open a dedicated tutorial to solve this problem. In this course, we
We will focus on other properties of the window.

Other window properties are mainly related to split windows.

In JavaScript, the processing of split windows is the same as that of other windows. You only need to use javascript to modify the appearance of another window in one exit. You can change the appearance of each split window. But remember, in a window
The split windows are actually treated as several other windows, because the split windows can contain smaller split windows. That is to say, you have a window at the highest level, which contains the first-level split window. This split window is actually a new small window, and a small window can contain a smaller split window. But it generally does not need to be so complicated.

The following is an example of a split window created using javascript.

First, it is the window frame of the split window:






This is the same as a normal split window. Remember to name each split window in the window. The name of the first split window is control_frame, which contains the HTML webpage added with javascript. The src = "#" of the second split window, which does not contain anything.

Next, let's take a look at the content in the control_frame window. The following is a key line:

'); "> Monkey see

When this statement is executed, JavaScript starts from the top level of the window level. This layer contains the window boxes for split windows. It is found that the split window named target_frame is also a window, it has the document attribute of the window. JavaScript finds its document attribute and calls the writeln () method. The execution result is to write "Monkey do!" in the file! ". Writeln () is the method of the file (document) object. Therefore, we must write document. writeln () instead of writeln ().

In the previous example, we used the built-in variable top, which always refers to the browser window at the highest level of the window. If you plan to execute the command from the highest level of the split window, you can use the top variable.

Another built-in variable is parent, which refers to the parent window that contains the current split window. If there is a split window in a window, and a split window contains a split window, the split window at Layer 2 can be referenced with the parent variable to include its parent split window.