JavaScript learning (Getting started)

Source: Internet
Author: User

Unconventional is about the features of javascript:

1. All major browsers are JavaScript-enabled.

2. The absolute scoring page uses JavaScript.

3.javascript can achieve a variety of dynamic effects of web pages.

4. Easy to learn, as long as there is a text editor, you can write JavaScript programs.

As a test, it is necessary to understand some development skills ... In short, don't settle for a little bit of testing side dishes.

Start learning ...

--------------------------------------------------------------------------------------------------------------- --------------------------------------

The way to add JS code to a webpage is to use paired <scrpit> tags, as follows:

<script type= "Text/javascript" >
document.write ("Hello");
</script>

Where: The first label of the Type= "Text/javascript" indicates that the text inside the browser is a JavaScript language.

PS: In addition to writing JavaScript code directly in the HTML file, there is another way is to separate the HTML file and JS code, and create a separate JavaScript file (suffix. js, abbreviated JS file) (Note: In the JS file, do not need < script> tag, write the JavaScript code directly. JS file cannot be run directly, need to embed in HTML file to execute, add code in HTML: <script src= "Script.js" ></script>).

For example: HTML file

JS file:

--------------------------------------------------------------------------------------------------------------- ------------------------------

About the location of JS in the page:

JavaScript can be placed anywhere in the HTML page as a scripting language, and the browser interprets the HTML in order, so the preceding script is executed first.

The JavaScript code is typically placed in the head or body part of the page, and in the head section the browser parses the head section to execute the JavaScript code, and in the body part, the JavaScript code executes when the page reads to the statement. Therefore, the page initialization of the JS must be placed in the head, because the initialization is done in advance, and the function through the event call to execute the position is not required.

About adding a comment: A single-line comment, with a symbol "//" before the content of the comment, and a multiline comment that starts with "/*" and ends with "/*".

About variables: JS defines the syntax of a variable: the var variable name (PS: variable is composed of any number of English letters, numbers, underscores, or dollar characters, where numbers cannot be first; You cannot use JavaScript keywords and reserved words; variables need to be declared and re-assigned and variables can be duplicated.) )

Note: case sensitivity in JS

--------------------------------------------------------------------------------------------------------------- -----------------------------------

Grammar Learning:

One: judgment statement: If...else

Grammar:

if (condition)

{Code executed when condition is set}

Else

{Code executed when the condition is not valid}

Two: function

Grammar:

Function name ()

{

function code;

}

PS: After the function is well defined, it cannot be executed automatically and needs to be called before it can be executed.

For example:

<! DOCTYPE html>
<meta http-equiv= "Content-type" content= "text/html; Charset=utf-8 "/>
<title> function calls </title>
<script type= "Text/script" >
function Contxt ()
{
Alert ("Haha, call the function out!") ");
}
</script>
<body>
<form>
<input type= "button" value= "click Me" onclick= "contxt ()"/>
</form>
</body>

Three: Output content document.write ()

Use case one: document.write ("I love javascript!"); /content is directly enclosed in double quotation marks, and the contents of the double quotation mark are output directly.

Use case two: var mystr= "Hello world!"; document.write (MYSTR); The output variable stores the contents.

Use case three: var mystr= "Hello"; document.write (mystr+ "I love JavaScript");//output multiple content, between content with + sign connection

Use case four: var mystr= "Hello";  document.write (mystr+ "<br>"); document.write ("JavaScript");

Four: JS in the output space

When writing the JS code, no matter how many spaces in the inner push of the output, the result of the display is only one space, because the browser display mechanism is: for manual quietly space, will be a continuous number of spaces displayed as a space.

such as: document.write ("1 2 3"); The result is: 1 2 3

Workaround One: Use the HTML &nbsp; Specifically: document.write ("&nbsp;&nbsp;" + "1" + "&nbsp;&nbsp;&nbsp;&nbsp;" + "2");

Workaround two: Use CSS style to solve the specific: document.write ("<span style= ' white-space:pre; ') > "+" 1 2 3 "+" </span> ");

White-space:pre This style means: The blank will be reserved by the browser.

V: Warning: Alert message dialog box

Syntax: alert (string or variable);

PS: Features: You cannot do anything else until you click OK in the dialog box, which can be used to debug a program, with the output of a string or variable similar to document.

Six: Confirm: Confirm message dialog box (including a OK button and a Cancel button)

Syntax: Confirm (str); Add: str Indicates the text to display in the message dialog box, the return value is Boolean, click "OK", return true; Click "Cancel" to return false

For example:

<script type= "Text/javascript" >    var mymessage=confirm ("Do you like the Internet industry?");    if (mymessage==true)    {   document.write ("Very good, come on!");   }    else    {  document.write ("Now is the Network information Society, Life everywhere Network Oh!");   } </script>

Seven: Question: Prompt message dialog box (pop-up message dialog box with a Disadvantage button, Cancel button and a text input box)

Syntax: prompt (STR1,STR2); Add: str1 represents the text to be displayed in the message dialog box, cannot be modified, STR2 represents the contents of the text box, and can be modified. Counterattack OK button, the contents of the text box will be returned as function return value, click the Cancel button, will return null

For example:

var myname=prompt ("Please enter your name:"), if (myname!=null)  {   alert ("Hello" +myname);} else  {  alert ("Hello my friend.");  }

Eight: Open a new window: window.open ()

Syntax: window.open ([url],[window name],[parameter string])

Parameter description: [] indicates optional parameter

URL: In the window to display the Web page URL or path, if omitted this parameter, or its value is an empty string, then the window will not display any document.

Window Name: The name of the window being opened. There are letters, numbers, and underscores, where "_top" (the target page is displayed in the upper window of the frames page), "_blank" (the target page is displayed in a new window), "_self" (the target page is displayed in the current window) is a name that has a special meaning. In addition, Windows with the same name can only create one, and name cannot contain spaces.

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

The parameter table is as follows:

For example: Open http://www.baidu.com website, size 300px*200px, no menu, no toolbar, no status bar, scroll bar window:

<script type= "Text/javascript" >
window.open (' http://www.baidu.com ', ' _blank ', ' width=300,height=200,menubar=no,toolbar=no, status=no,scrollbars= Yes ') </script>

Note: When running, consider compatibility.

Nine: Close the window (window.close)

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

For example: Var mywin=window.open ("http://www.baidu.com"); Mywin.close (); Note that the code in the Open window closes the window so that it does not see the window being opened.



JavaScript learning (Getting started)

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.