2017.11.9 (JavaScript and MySQL learning content)

One. JavaScript

A.tab Bar Toggle

The main highlight of tab switching is an exclusive idea.

Main Ideas (

1. First obtain the required elements, and then loop through the event by binding;

2. Then two cycles, with the aim of setting a uniform style for all elements;

3. Then, outside of the loop, separate controls are performed on the elements that need to be manipulated; (typically, the current element, using this)

）

Harvest

Use of 1.this

2. Question of thinking

3. Two unrelated things can create an opportunity to promote relevance

）

JS Code (

Window.onload =function(){        //get all the button elements        varBtns = Document.getelementsbyclassname ("top") [0].children; //get all the DIV elements        varDIVs = Document.getelementsbyclassname ("bottom") [0].children; //the first-level for loop binds a fixed-point event for each btn        for(vari=0;i<btns.length;i++){           //Create a connection between two sets of elements through attributesBtns[i].index =i; Btns[i].onclick=function(){                //second layer for loop traversal element, exclusive thought                 for(varJ =0;j<btns.length;j++) {Btns[j].classname= ' '; Divs[j].style.display= ' None '; } console.log ( This. Index);  This. ClassName = ' active '; divs[ This. Index].style.display = ' block '; }       }            }

B. Full selection and reverse selection

The code is actually and simply, mainly by judging the state of input, in fact I am even more puzzled if there are other input how to operate; I'll make sure of that tomorrow.

Main idea {

Select all to add to all input elements

true/"checked";

Inverse selection is the first judgment of the state, and then the separate processing

}

Code

    functionXuanze (item) { for(vari=0;i<inputs.length;i++) {inputs[i].checked=item; }} btns[0].onclick =function() {Xuanze (true); } btns[1].onclick =function() {Xuanze (false); } btns[2].onclick =function(){         for(vari=0;i<inputs.length;i++){            if(inputs[i].checked==false) {inputs[i].checked=true; }Else{inputs[i].checked=false; }        }    }

}

Harvest

input.checked = true/"Checked" to determine whether to select

}

)

Theoretical knowledge:

A. Array small operations (very common, but the project does less, naturally use less)

1. Operating data
Add one or more elements after the push array
Unshift array before adding one or more elements
Delete the first element after a pop () array
Shift () array before the first element is removed

2. Connect two or more arrays without changing the original array
Contact ()
A.contact (b)

3. Conversion of strings and arrays to each other
Split (parameter 1);
What parameter 1 cuts a string
String Conversions to arrays

Join (parameter 1);
Parameter 1 symbol with what to split the array
Array conversion to string

B.dom operation

1. Element Lookup

Parent Node ParentNode
Brother Node
NextSibling IE678 know
Nextelementsibling
PreviousSibling IE678 know
Previouselementsibling
Child nodes
FirstChild IE678 know
Firstelementchild
LastChild IE678 know
Lastelementchid
All child nodes
ChildNodes
Pick all the kids. High-version browsers will also consider line breaks as child nodes

Children
Select all children, IE will treat annotations as child nodes

NodeType = 1 element node

2. Element manipulation

Create node Docuemnt.createelement ("element tag");

Adding nodes
AppendChild () put on the last side

InsertBefore (Insert node, reference node)
Insert to front of reference node
The second parameter is NULL, and the newly generated box defaults to the last face.

Delete a node
RemoveChild

Replication nodes
CloneNode ();
If the inside is true deep copy (copy child node)

If the inside is false shallow copy

Second, MySQL

The main thing to see today is DOS operations.

The main thing is alter (which has been written in front of the alert)

View database show databases;
Create DATABASE Database name
Use database name;

CREATE TABLE table name (field name 1 data type (data length), Field name 2 data type (data length),...);
To view the structure of a table desc table name
View the Build Database statement show CREATE DATABASE name
View the Build Table statement Show create TABLE table name
Modify field value ALTER TABLE name modify field name modified value
Modify a table's field ALTER TABLE name change field name modified type and length of field name
Delete field ALTER TABLE name drop field name;
Insert field ALTER TABLE name add field Name field name and length position (first/after fields name);
Modify table name ALTER TABLE name Rename modified name

2017.11.9 (JavaScript and MySQL learning content)