1. Form elements
1.input elements
1. Hide Fields and Files Options box
1. Hidden fields
<input type= "hidden" >
The data to be submitted to the server, but does not want to show to the user can be placed in the hidden domain.
2. File selection box
<input type= "File" >
Attention:
The value of the 1.method attribute must be post
The value of the 2.enctype attribute must be multipart/form-data
2.textarea elements
2. Use
A text box that allows multiple lines of data to be entered.
2. Syntax
Mark:<textarea></textarea>
Property:
Name: Defines the name of the control that is used by the service provider
ReadOnly: Read-only, value-free property
COLS: Specifies the number of columns of the text field, that is, how many English characters the line can display (half of the Chinese characters)
Rows: Specifies the number of lines of text fields, that is, how many rows of data are displayed by default, and scroll bars appear when you exceed rows.
3.select elements
1. Syntax
1.<select></select>
Function: Represents an option box in a page
2.<option></option>
Function: Represents an option
2. Properties
1.select Properties
1.name define the name of the option box
2.size defines the number of default display options, the default value is 1
3.multiple set multiple selection, no value attribute
Multiple selections are supported only for scrolling lists.
2.option Properties
1.value define the value of the option
2.selected Set Default check, no value attribute
4. Other elements
1.label elements
Function: The text of the associated form control
Mark:<label></label>
Properties: For
Sets the ID value of the form control to be associated with this element
2. Grouping controls
<fieldset></fieldset> Grouping controls
<legend></legend> assigning headings to groups
3. Floating Frame
Role: Allow in one page, and then introduce other pages
Grammar:<iframe></iframe>
Property:
1.SRC Web Path (URL) to be introduced
2.frameborder border of floating frame, default value 1
3.width width
4.height height
Practice:
Create a new footer.html Web page, write a copyright note on the Web page, and introduce footer.html through the IFRAME in the Index.html Web page.
2. New Form elements
1. What is a new form element
The newly introduced control in the HTML5 version.
2. Detailed
1. e-Mail type
<input type= "Email" >
Role: When the form is submitted, it verifies that the data conforms to the email specification (@)
2. Search Type
<input type= "Search" >
Function: Provides quick clear function
3.url type
<input type= "url" >
Role: When committing, verify that the data conforms to the specification of the URL (absolute path specification)
4. Phone Number Type
<input type= "Tel" >
Action: In the mobile settings, display "dial pad"
5. Number types
<input type= "Number" >
Function: Only receive numbers, and can flexibly adjust the value of the number
Property:
Value: Control of values
Min: The minimum value that can be received
Max: The maximum value that can be received
Step: The range of changes each time the number is adjusted
6. Scope type
<input type= "Range" >
Function: Provides a slider component that allows the user to select a value for the specified range.
Property:
Value: The default value of the control.
Min: The minimum value that can be received
Max: The maximum value that can be received
Step: The step size of the range
7. Color type
<input type= "Color" >
Function: Provides a color pickup control
8. Date Type
<input type= "Date" >
Function: Provides a date selection control
9. Week Type
<input type= "Week" >
10. Month Type
<input type= "Month" >
3.JavaScript Overview
1. What is JavaScript?
JavaScript, abbreviated as JS, is a scripting language that runs in JS interpreter/engine.
Operating Environment:
1. Independently installed JS interpreter (node)
2. JS interpreter embedded in the browser kernel
The history of 2.js
1.1992 years Nombas Company developed a scripting language scriptease for its own software, which can be run in a browser.
2.1995-year Netscape developed another scripting language LiveScript, later renamed JavaScript
3.1996-year Microsoft clone version in IE3.0 version JSScript
4.1997-year submission to ECMA (European Federation of Computer Manufacturers), definition of ECMAScript (ES5,ES6)
The composition of the 3.JS
Consists of the following three parts:
1. Core (ECMAScript)
2.DOM (Document Object Model)
Document Object Model
Provides a set of functions and properties that allow you to manipulate page elements.
3.BOM (Browser Object Model)
Browser Object Model
Provides a set of functions and properties that allow you to manipulate the browser.
Features of 4.js
1. Syntax similar to C,java
2. No need to compile, run directly by JS interpreter
3. Weakly typed languages
4. Object-oriented
Basic syntax for 4.JavaScript
1. Using JS
1. Operating Environment construction
1. Standalone Installation JS interpreter (node)
1. Enter node in the command line interface press ENTER
2. Enter Console.log ("contents of printout");
2. Using the browser kernel to embed JS interpreter
The browser core is responsible for rendering the content in two parts:
1. Content typesetting engine-parsing HTML and CSS
2. Scripting interpreter engine-parsing javascript
1. Enter the JS script directly in the browser
Console.log ();
2. Embed the JS script in the HTML page to execute
1.HTML elements of the event execution JS script
Event: onclick-the action to take when the mouse is clicked
Ex
<input type= "button" value= "Would you please give me a try?" "Onclick=" console.log (' dot you?! ') ' >
2. Write the script in the <script> tag and execute
Anywhere on the page, embed a pair of <script></script> tags,
Write the JS code in <script>.
The output mode of JS:
Console output: Console.log ();
Pop-up box output: alert ();
Web page output: document.write ();
3. Use external script file (. js as suffix)
1. Create a script file
2. Write the JS script in the file
3. Use of the Web page to introduce
<script src= "JS file path" >
After introducing the external JS file, the JS script can no longer be written in the scirpt tag.
</script>
JS Basics-Table cells-new table cell-js overview