- Three ways to use <script></script>:
- Put in the <body>
- Put in the
- Placed in an external JS file
<!DOCTYPE HTML><HTMLLang= "en"><Head> <MetaCharSet= "UTF-8"> <title>Text1</title> <Script> functiondisplaydate () {document.getElementById ("Text1"). InnerHTML=Date (); } </Script> <Scriptsrc= "1.js"></Script></Head><Body> <P>Hello</P> <Script>document.write (Date ()) document.getElementById ("Demo"). InnerHTML=Date (); </Script> <Buttontype= "button"onclick=window.alert ("User name cannot start with a number")>button</Button></Body></HTML>
- Three ways to output data:
- Use the document.write () method to write content to an HTML document.
- Use the Window.alert () pop-up warning box.
- Writes to an HTML element using InnerHTML.
- Use the ID property to identify the HTML element.
- Use the document.getElementById (ID) method to access HTML elements.
- Use innerHTML to get or insert element content.
<!DOCTYPE HTML><HTMLLang= "en"><Head> <MetaCharSet= "UTF-8"> <title>Text2</title></Head><Body> <PID= "Text2">111</P> <Script>document.getElementById ("Demo"). InnerHTML=Date (); </Script> <Buttontype= "button"onclick=window.alert ("User name cannot start with a number")>button</Button></Body></HTML>
- The login page prepares:
- Add an Error prompt box.
- Write a good html+css file.
- Set the ID of each INPUT element
- Defines a JavaScript function.
- Verify user name 6-20-bit
- Verify password 6-20-bit
- The onclick invokes this function.
<!DOCTYPE HTML><HTMLLang= "en"><Head> <MetaCharSet= "UTF-8"> <title>Text3</title> <Linkrel= "stylesheet"type= "Text/css"href=".. /static/css/123.css "> <Script> functionFnlogin () {varOuname=document.getElementById ("uname"); varOupass=document.getElementById ("UPass"); varOerror=document.getElementById ("Error_box"); if(OUname.value.length< 6 ||OUname.value.length> -) {oerror.innerhtml= "Please enter a 6-20-digit user name" } if(OUpass.value.length< 6 ||OUpass.value.length> -) {oerror.innerhtml= "Please enter a 6-20-digit password" } if((OUname.value.length< 6 ||OUname.value.length> Ten) &&(OUpass.value.length< 6 ||OUpass.value.length> -) ) {oerror.innerhtml= "Please enter a 6-20-digit user name and password" } } </Script></Head><Body><Divclass= "box"> <H2>Login</H2> <Divclass= "Input_box"> <inputID= "Uname"type= "text"placeholder= "Please enter user name"> </Div> <Divclass= "Input_box"> <inputID= "UPass"type= "text"placeholder= "Please enter password"> </Div> <DivID= "Error_box"><BR></Div> <Divclass= "Input_box"> <Buttonclass= "button"onclick= "Fnlogin ()">Login</Button> </Div></Div></Body></HTML>
body { width:100%; height:100%; margin:0; Background:rgba (20,20,20,20);}
JavaScript Basics, Login verification