Practical Tips1 getting elements from a page
document.getElementById () based on the value of the ID
Document.getelmenntsbyclassname () based on the value of class
Document.getelementsbyname () based on the value of the Name property
Document.queryselector (CSS selector) returns the first element object that satisfies a condition
Document.queryselectorall (CSS selector) returns all class array objects that satisfy the conditional element
2 Binding an event to an element
Get elements First
Ele.onclick = function () {
}
?
Gets the class array object of the element, iterating through each element to bind the event
3 Modifying the CSS style of an element
Ele.style.css Property Name
Ele.style.background
Ele.style.border
Ele.style.backgroundColor
ele.style[' Background-color ']
4 Setting the class value of an element
Ele.classname can be assigned to a value, or it can be obtained
Ele.classList.add (' value ') adds a class value
Ele.classList.remove (' value ') deletes a class value
Ele.classList.toggle (' value ') automatically switches a class value (with Delete, no add)
5 Events
Click
Double click
OnContextMenu Right-click
Onmouseover/onmouseenter mouse hover over element
Onmouseout/onmouseleave Mouse Away Element
OnMouseMove Mouse on top move
OnMouseDown the mouse button press
OnMouseUp mouse button to lift
6 JS Timersingle-Time timing
SetTimeout (FN, delay)
Cleartimeout () Clear Timer
Multiple Timing
SetInterval (FN, dealy)
Clearinterval () Clear Timer
JavaScript built-in object 1 Number1.1 properties
- Max_value JS can represent the largest number
- Min_value JS can represent the smallest number
1.2 Methods
- ToFixed (length) specifies the length of the decimal that is reserved
- Toexponential () expressed by scientific notation
- Toprecision (length) requires numbers to display integers + decimals at a specified length
- ToString (number) converts numbers to strings that can be returned in the specified binary
2 String2.1 Properties
2.2 Methods
- CharAt (index) returns the character at the specified position
- Concat (string) connection string
- IndexOf (str) Returns the first occurrence of a small string in a string object-1 means that it does not exist
- LastIndexOf () returns the position of the last occurrence of a small character in a string
- substr (start, length) intercept string omit length intercept to end
- SUBSTRING (start, end) intercepts the string, omitting the end position until the last
- Slice (start, end) is identical to substring
- Split (char) splits a string into arrays
- toUpperCase () Convert string to uppercase
- toLowerCase () Convert string to lowercase
- Match () matched string available regular
- Search () Find string available regular
- Replace (old, new) replacement string available regular, replace only once
- charCodeAt () returns the Unicode encoding of the character at the specified position.
- String.formcharcode () creates a string from character encoding.
3 Array3.1 Creating an array
- Use Direct volume
[]
- constructor function mode
new Array()
var list = [Item1, item2, item3 ...]
var list = new Array ()
3.2 Array Features
- Index must be contiguous
- If the index is not contiguous, a sparse array is generated
3.3 Traversal of an array (iteration)
- For loop traversal
for (var i = 0; i < arr.length; i + +) {
Arr[i]
}
- For...in cycle
for (var i in arr) {
Arr[i]
}
- For...of Cycle
Recommended Array Method ForEach
Arr.foreach (function (val, index) {
})
3.4 Adding and removing of array elements
Delete
Change array length
List.pop () Delete the last element that returned the deletion
List.shift () Delete the first element that returns a delete
List.splice (location, number of deletions) specify the location to delete the specified number
operator delete?
Setting modifications
List[index] = value
List.splice (location, number of deletions, value 1, value 2 ...)
3.5 Array Object Properties
- Length array number of elements
3.6 Array Object Methods
Splice ()
Deletes the specified number of elements in the specified position
Replaces the specified number of elements in the specified position
Add an element at the specified location
Returns an array of the elements that were deleted
Reverse () flipping an array
Sort () array sorting
Push () and pop () add or remove elements at the end of the array
Unshift () and Shift () Add or remove elements at the front of the array
ToString () and tolocalstring () convert the array to a string
Join () to stitch the elements of an array into a string
Slice () intercepts a portion of the array, returning the new array slice (start, end)
Concat () merging multiple arrays
IndexOf () Searches the elements in the array and returns where it is located.
LastIndexOf () returns the position of the last occurrence of a specified string value, in a string at the specified position, from the back to the forward search.
ForEach () Traversal loop
Map () Processes each element of an array by specifying a function and returns the processed array.
Filter () detects the numeric element and returns an array of all elements that match the condition.
Every () detects whether each element of a numeric element meets the criteria.
Some () detects whether an element in an array element meets the specified criteria.
Reduce () combines array element index values from low to high reduceright () combine array element index values from high to low
5 Function5.1 Properties
5.2 Methods
- Apply (object, array) while calling the function (method), change the direction of this in the function
- Call (object, parameter, Parameter 2 ...) While calling the function (method), change the direction of this in the function
- Bind () Returns a function that is called as a method
6 Math6.1 Properties
- MATH. Pi returns PI (approximately equal to 3.14159).
6.2 Methods
- ABS (x) The absolute value of the return number.
- SQRT (x) returns the square root of the number.
- The POW (x, y) returns the y power of X.
- Ceil (x) is rounded on the logarithm.
- Floor (x) is rounded down with a logarithmic.
- Round (x) rounds the number to the nearest integer.
- Max (x, y) returns the highest value in X and Y.
- Min (x, y) returns the lowest value in X and Y.
- Random () returns an arbitrary number between 0 and 1.
Take a random number
0~9
Math.floor (Math.random () * 10)
6~13
Math.floor (Math.random () * 8) + 6
7 Date7.1 method
- GetYear () Please use the getFullYear () method instead.
- getFullYear () returns the year as a four-digit number from a Date object.
- GetMonth () returns the month (0 ~ 11) from the Date object.
- GetDate () Returns the day of the one month (1 ~ 31) from the Date object.
- GetDay () Returns the day of the week (0 ~ 6) from the Date object.
- GetHours () returns the hour (0 ~ 23) of the Date object.
- Getminutes () returns the minute (0 ~ 59) of the Date object.
- Getseconds () returns the number of seconds (0 ~ 59) of the Date object.
- Getmilliseconds () returns the milliseconds (0 ~ 999) of the Date object.
- GetTime () returns the number of milliseconds since January 1, 1970.
- getTimezoneOffset () returns the minute difference between local time and Greenwich Mean Time (GMT).
- Getutc .... Standard Time Zone
- Set ...
- SETUTC ...
- toTimeString () Converts the time portion of a Date object to a string.
- toDateString () Converts the date part of a Date object to a string.
- toUTCString () Converts the Date object to a string based on the universal.
- toLocaleString () Converts a Date object to a string based on the local time format.
- toLocaleTimeString () Converts the time portion of a Date object to a string, based on the local time format.
- toLocaleDateString () Converts the date part of a Date object to a string, based on the local time format.
8 RegExp8.1 Properties
- Whether the global RegExp object has a flag g.
- IgnoreCase whether the RegExp object has a flag I.
- LastIndex An integer that indicates the position of the character at which to begin the next match.
- Multiline whether the RegExp object has a flag m.
- The source text of a regular expression for a source.
8.2 Methods
- EXEC () Retrieves the value specified in the string. Returns the found value and determines its location.
- Test () Retrieves the value specified in the string. Returns TRUE or FALSE.
Method of the String object
Search () The first match to a position that does not match 1
Match () with R.exec ()
Replace () replaces, by default, only one, regular global match
9 JSON9.1 method
- Json.parse () parsing a JSON-formatted string
- Json.stringify () serializes an array of objects or raw values
Ten Global10.1 Properties
10.2 Methods
- Escape () encodes the string in Unicode.
- Unescape () decodes a string encoded by escape ().
- encodeURI () encodes the string as a URI. For some other symbols that have special meanings in the URL "; / ? : @ & = + $, # "Do not encode
- decodeURI () decodes a coded URI.
- encodeURIComponent () encodes a string as a URI component
- decodeURIComponent () decodes a coded URI component.
- Eval () computes the JavaScript string and executes it as script code.
- Isfinite () checks if a value is a number that has a poor size.
- IsNaN () checks whether a value is a number.
- parseint () parses a string and returns an integer.
- Parsefloat () parses a string and returns a floating-point number.
- Number () Converts the value of the object to a digit.
- String () Converts the value of the object to a string.
- All built-in constructors are properties of global objects
JavaScript built-in objects and usage tips (iii)