Bia Niang JS Tutorial First talk--"honey, Let's chat"

Source: Internet
Author: User

JavaScript , a literal translation scripting language, is a dynamic type, a weak type, a prototype-based language, and a built-in support type. Its interpreter, known as the JavaScript engine, is widely used in the client's scripting language as part of the browser, and is first used in HTML(an application under the standard Universal Markup language) to give HTML Web page adds dynamic functionality.

  blah, you have finished reading the above, you will faint . Because I read n times, I just white a little,js This thing, good wow. Not only do I think, it's awesome, then it must help me do one thing, this thing, I do not use HTML , this thing is-- let my Web Page "Live". For a front end,whatJavaScript is used to do compared to what he is,Mia thinks more important.

  now, I'm going to say, "live up." One person, forget it, just say one .Mia,MiaIf you want to "live up",SoMiayou want to have an attribute of "behavior." What is behavior, behavior is whenMiato do something,Miawill beWhat to do, or when someone else is rightMiadid something,Miahow it reacts. Miathe object of the behavior is an event,It is the things that you are going to do and the things that you are facing.

Does Mia have a behavior for the event Mia is alive? So, in the page, controlling The behavior of Mia (how to respond to events) is the function in JS function.

Below, Mia takes a conversation with Dear bia as our first js Tutorial Case- "Dear, Let's have a chat. "

BIA must have seen the first demo, first of all we have to understand, when to execute the function js (How to open our behavior)?

We always respond to events. So on the page, we're just going to do it when the event is triggered.function. For example, when the page loads,Miawant to talk toBIAask for good, so say hello to this behavior (function Hellobia()) is the beginning of a conversation, i.e.onloadtriggered by this event. when we want to make an action, we need to The action to be triggered under what event. The event is the onload event of the body , and the behavior that you want to trigger is Hellobia (),So we're inBodywrite in Labelonloadthe response of the event is configured as:

<onload= "Hellobia ()">

Hellobia() This response needs to be written in the brain, which is written in the JavaScript tag section, as follows:

<type= "Text/javascript">    function  Hellobia () {        alert (" Hello, biabia! ");    } </ Script >    

When we open the page, I will take the initiative to say hello to you oh ~

Summary: Behavior is always what the event of what to do. Another example: A button wants to jump out of the box when clicked. Then the button is the object, click is the event, jumping out of the box is the behavior. What and what events are HTML control, then we want to achieve what behavior is the key to our learning js . in the implementation of the behavior, we will use a lot of logic, simply speaking, is our statement, here I simply say we use the element selection,if judgment and for loops .

  

① element Selection:

var moodvalue = Document.getelementsbyname ("Mood");

Here we use the radio button, which isHTMLthe form elements inside are special, because each of the radio labels uses the samename, so we can use the same one for multiple radio buttonsnameto get the elements of this class, we all usedocument.getelementsbyname ("xxx")to obtain ("XXX" for the labelname). For the general element, we usedocument.getElementById ("xxx")to obtain ("XXX" for the labelID)Like whatDiv,inputand so on. There are more convenient writing, such as we getIDto beBiawordof theDivin theHTMLwith thedocument.getElementById ("Biaword"). InnerHTML, can also be directly writtenbiaword.innerhtmlget, briefly mentioned here, in detail in the following few words.

After acquiring the element, we can . Value to get the element value, and thediv element can use the . InnerHTML to get the div the HTML content in the next few words to summarize in detail.

②if judgment:

if (Value = = "0") {  ...} Else if (Value = = "1") {  ...} Else {  ...}    

The above is written for us to judge the radio box value, to determine the contents of the display div . Ellipsis to write innerHTMLto div , omitted here. This is used in the same syntax as C ,if the parentheses followed by the judgment condition, that is, conditional expression, conditional expression of the wording, after a few more detailed said.

The general wording of the judgment isif...Else. ....,Elseafter not writing parentheses, when not satisfiedifwhen judging conditions, performElsesection. Like the example above is a complexifJudging, you can write multiple conditions that satisfy the curly brace statement after the condition is executed. In addition to the first one to writeifIf the condition is determined by the following, then writeelse ifif all of the above conditions are not met, writeElse,Elsewritten in the end,Elsecan be omitted without writing.

③ for loop:

 for (var i=0; i<5; i + +) {        ...}

Above is a forexample of a loop, the ellipsis is the statement executed for Each loop. Which forthe parentheses behind the loop are not all conditions, there are three statements, and 22 are separated by semicolons. First statementvar i= 0is to create a new variable to be counted, the initial value of the variable is1. The second statement isi<5is the condition that the execution is judged, and the statement in the following curly braces is executed if the condition is met. The third statement isi++is the processing statement that executes after the curly brace statement is executed, herei++meaning is to count the variablesIPlus1.

The intermediate conditions can be written more complex, such as the i<moodvalue.lengthwe write in the demo ,moodvalue is the number of groups, moodvalue.length The length of the array, in the demo for loop meaning loop traversal Moodvalue array to find the value of the selected radio box element and process the displayed content.

Well, with element selection,if judgment and for Loop we can write a lot of behaviors oh ~ We're going to talk about variables like elements, numbers, arrays, What are they all for? Oh, is not dizzy da, nothing, second, we say variables oh, look forward to our second talk Oh,biabia~

  Our story is not to be continued.

Bia Niang JS Tutorial First talk--"honey, Let's chat"

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.