JS Basic Learning Notes (ii)

2.1 Output content (document.write)

document.write () can be used to write content directly to the HTML output stream. The simple thing is to print the content directly in the Web page.

The first type: The output content is enclosed in "", directly Output "".

<script type= "Text/javascript" >

document.write ("I Love JavaScript! ");  content is output directly from the content in "" ,"" .

</script>

The second type: through variables, output content

<script type= "Text/javascript" >

var mystr= "Hello world!";

document.write (MYSTR); write the variable name directly, and the output variable stores the contents.

</script>

The third type: output multiple items, the content is connected with the + number.

<scripttype= "Text/javascript" >

var mystr= "Hello";

document.write (mystr+ "I love JavaScript"); Connect multiple items with a + sign

</script>

The fourth type: output HTML tags, and work, the label using "" enclosed.

<script type= "Text/javascript" >

var mystr= "Hello";

document.write (mystr+ "<br>");/ /output Hello , output a line break

document.write ("JavaScript");

</script>

2.2 Warning (Alert message dialog box)

When we visit the site, sometimes suddenly pop up a small window, which is written with a text message. If you do not click "OK", you can not do anything to the Web page, this small window is the use of alert implementation.

Grammar:

Alert ( string or variable );

2.3 Confirmation (Confirm message dialog box)

The Confirm Message dialog box is often used to allow the user to make a selection action, such as: "Are you right?" such as A popup dialog box (including a OK button and a Cancel button).

Grammar:

Confirm (str);

Parameter description:

STR: the text to display in the message dialog box

return value :Boolean value

return value:

returns true when the user taps the OK button

returns false when the user taps the cancel button

Note: By returning a value you can tell what button the user clicked.

2.4 Questions (Prompt message dialog box)

The prompt pop-up message dialog box, typically used to ask some information that needs to interact with the user. Pop-up message dialog box (contains a OK button, Cancel button and a text input box).

Grammar:

Prompt (str1, str2);

Parameter description:

STR1: text to display in the message dialog box, not modifiable

STR2: The contents of the text box can be modified

Return value: Determine if (variable!=null & variable! = ")

1. Click the OK button and the contents of the text box will be returned as a function return value (NULL when no value is returned, may be variable! = ")

2. Click the Cancel button to return null

2.5 opening a new window (window.open)

The open () method opens a new window.

Grammar:

window.open (<url>, < window name ;, < parameter string >)

Parameter description:

URL: opens the URL or path of the window.

Window Name: The name of the window being opened.

Can be "_top","_blank","_selft" and so on.

Parameter string: Sets the window parameters, separated by commas.

Parameter table :

2.6 close window (window.close)

Close () Closes the window

Usage:

Window.close (); Close this window

Or

< Window object >.close (); // Close the specified window

2.7 Programming Exercises

Make New button, "New window opens website", click Open New Window.

Task

1. Pop-up confirmation box when new window opens, open

2, through the Input dialog box, determine the open URL, the default is http://www.imooc.com/

3, open the window requirements, 400 pixels wide, 500 pixels high, no menu bar, no toolbar.

Html:

<input type= "button" value= " new window open Web site " onclick= "Openwindon ()"/>

Js:

function Openwindon () {

var new0 = confirm (' do you want to open a new window? Open The confirmation box when the new window opens .

if (new0==true) {

var new1 = prompt (' Please enter a new URL .... ', ' http://www.baidu.com/');// by entering a dialog box to determine the open URL, the default is http://www.baidu.com/

if (new1!=null& new1!= ") {

window.open (new1, ' _blank ', ' width=400,height=500,scrollbas=no ');// open window requirements, wide pixels, high - pixel, no scroll bar.

}else{

Alert (' you didn't enter a valid URL .... ')

}

}

}

Reference: