JavaScript Beginner Tutorial (fifth lesson) 1th/4 Page _ Basics

Now you've learned the basics of computer programming. We'll go on to look at the Document Object Model (MODEL-DOM). The click relationship of the DOM begins with the Window object, which is a Document object in each Window object. We'll focus on the document object and see how to use it to get all the information from your users and dynamically display new information.

We have seen a property of a file object-an array of images (Images array). In the 3rd lesson, the 1th image in the file can be modified by changing its SRC attribute.

Cases:

window.document.images[0].src= ' some_new_picture.gif ';

This command will change the 1th image in the document to a new image named Some_new_picture.gif. In the DOM, every image in an array of images is also an object. So the images[0].src instruction acts like an object, which means that the object image[0 in image is called from an image array and its SRC attribute is set. Translate it by invoking the document property from the window, invoking the 1th image from the image array of the document, and some_new_picture.gif its src attribute to image.

There are many other interesting properties of the image object, for example, you can have JavaScript check whether an image is fully loaded before doing anything else. However, we can only talk about these attributes in a future course. Today, we'll talk about feedback forms and how to apply feedback forms in JavaScript.

The feedback form is part of the HTML 1.0 specification. A lot of people don't know much about it. Many people only think that it can only be because of client-side CGI programming. In fact, even if you are not a CGI programmer, the feedback form will provide you with a lot of functionality. JavaScript can be used to add a variety of functionality to the feedback form. And there is no need for user-side CGI support.

If you don't know how the feedback form works, learn about the course in introductory HTML. And then start to learn this lesson.

First, in JavaScript, the feedback form is also stored in an array of objects. You can invoke the first image in an array of images by window.document.images[0], or you can use Window.document.forms[0 to invoke the 1th form in the singular group of feedback forms. You can name the image or, in a similar way, name the feedback form. For example, if the feedback form

is programmed as follows:

<form name= "First_form" >
<input type= "text" name= "First_text" size= "value=" "power to the primates!" >
</form>

You can reference this form in one of the following two ways:

var the_form = window.document.forms[0];
var the_same_form = Window.document.first_form;

More often, you need to refer to the elements in the form, such as the text field in the example above.

Slide the mouse over the link to see what the hairstyle will be.

Yes, and I know it. No!

This wonderful transformation can be achieved by changing the value of the text field.

<form name= "Second_form" >
<input type= "text" name= "First_text" value= "Are you happy?" >
</form>

The link to change the text field is:

<a href= "#" onmouseover= "window.document.second_form.first_text.value= ' clap clap! ';" >yes, and I know it.</a>

<a href= "#" onmouseover= "window.document.second_form.first_text.value= ' Sour puss! ';" >No!</a>

It means that the table is monotonous with the 1th form and sets its value to ' Clap clap! ' The 2nd line acts similarly. This is very similar to the SRC that changes the image. But the text field changes the value.

A similar approach to Textareas can also be used to change values:

i wanna be a webmonkey, mancub and stroll right into town and is just like the other Webmonkeys I wanna start Monke Yin ' around!

Part 1 Part 2

Form encoding:

<form name= "Third_form" >
<textarea name= "The_textarea" rows=10 cols=60>
Mouse over below to-
The Webmonkey song, adapted from
"I wanna Be As You" (The Monkey Song)
From Walt Disney ' s The Jungle Book
Written by Richard M. Sherman and Robert B. Sherman
</textarea>
</form>

Note that the form has a name: Third_form, and the text area also has a name: The_textarea.

The link and Text field settings are basically the same:

<a href= "#" onmouseover= "Window.document.third_form.the_textarea.value=first_part;" >part 1</a>
<a href= "#" onmouseover= "Window.document.third_form.the_textarea.value=second_part;" >part 2</a>

The only difference is that assigning a variable to textareas instead of assigning the string to it. The variable is already defined in the HTML header.

The following is a string assignment for a variable:

var First_part = "Now I m" The king of the Swingers\noh, the Jungle Vip\ni ' ve reached the top and had to Stop\nand that ' s W Hat Botherin ' me ';

Note that "\ n" is a newline character. If you write in a <pre> and or in a textarea, "\ n" line breaks are very handy.

In addition to changing the value of a form element, JavaScript allows you to detect events in the form. The next lecture will be introduced.

Current 1/4 page 1234 Next read the full text