1. Add/remove header/tail (push(), pop(), unshift(), shift()))

Example 1: Set the array length

html

< ul > < li > 1, the length of an array of Settings < / li > < / ul > < ul > < li > < span > var arr = [1, 2, 3, 4, 5] < / span > < button > default length < / button > & have spent </button></li> </ul>Copy the code

js:

var btn = document.getElementsByTagName('button');
btn[0].onclick = function() {var arr = [1, 2, 3, 4, 5]; Alert (arr) //1,2,3,4,5}// Original array BTN [1]function() {var arr = [1, 2, 3, 4, 5]; arr.length = 3; Alert (arr) //1,2,3Copy the code

* 2 cases, arrays, the tail to add * * push () * method can add one or more elements to the array at the end of, and returns the new length syntax: arrayObject. Push (newelement1, newelement2,… ,newelementX)

html:

< ul > < li > 2, array tail add push < / li > < / ul > < ul > < li > < span > var arr = [1, 2, 3, 4, 5] < / span > < button > tail add < / button > & have spent </li> </ul>Copy the code

js:

btn[2].onclick = function() {var arr = [1, 2, 3, 4, 5] arr. Push (6) alert (arr) 6} / / / / add an element at the tailCopy the code

The arrayObject.pop() method is used to delete and return the last element of an array.

html:

< ul > < li > 3, arrays, the tail delete pop < / li > < / ul > < ul > < li > < span > var arr = [1, 2, 3, 4, 5] < / span > < button > tail to remove an < / button > & have spent </li> </ul>Copy the code

js:

btn[3].onclick = function() {var arr = [1, 2, 3, 4, 5] arr. Pop () alert (arr) / / 1, 2, 3, 4} / / delete a tailCopy the code

Example 4: array add head unshift () method to add one or more elements to the beginning of the array, and returns the new length syntax: arrayObject. Unshift (newelement1, newelement2,… ,newelementX)

html:

< ul > < li > 4, add the head of array unshift < / li > < / ul > < ul > < li > < span > var arr = [1, 2, 3, 4, 5] < / span > < button > add a head < / button > & have spent </li> </ul>Copy the code

js:

btn[4].onclick= function(){var arr = [1,2,3,4,5] arr.'w') alert(arr) //w,1,2,3,4,5}// add a headerCopy the code

The shift() method removes the first element from an array and returns the value of the first element: arrayObject.shift()

HTML:

<ul> <li>5, array header deleteshift< / li > < / ul > < ul > < li > < span > var arr = [1, 2, 3, 4, 5] < / span > < button > head to remove an < / button > & have spent </li> </ul>Copy the code

js:

btn[5].onclick = function() {var arr = [1, 2, 3, 4, 5] arr. The shift () alert (arr) / / 2, 5-tetrafluorobenzoic} / / delete a headCopy the code

Splice () — You can delete any number of items by specifying two parameters: the location of the first item to be deleted and the number of items to be deleted. Arr.splice (starting point, length) [for example, arr.splice(0,2) deletes the first two items in the array.]

html:

</li> <ul> <ul> <li><span>var arr=[1,2,3,4,5] </span><button> delete 2-4</button> &nbsp; </li> </ul>Copy the code

js:

btn[6].onclick = function() {var arr = [1, 2, 3, 4, 5] arr. Splice (1, 3) / / from behind the first element, remove the three elements of alert (arr) / / 1, 5} / / delete 2-4Copy the code

Example 2: Array add splice() — You can insert any number of items into a specified position by providing only three arguments: the insertion start position, 0 (number of items to delete), and the item to insert. If you want to insert more than one item, you can pass in the fourth, fifth, and any number of items. Syntax: arr.splice(starting point, length 0, element to add) [e.g. Arr.splice (2,0, “a”, “b”) inserts strings “a” and “b” from position 2]

html:

</li> <ul> <ul> <li><span>var arr=[1,2,3,4,5] </span><button> &nbsp; </li> </ul>Copy the code

js:

btn[7].onclick = function(){var arr = [1,2,3,4,5] arr.'abc')// add the ABC element alert(arr) from the first element //1, ABC,2,3,4,5}// add ABCCopy the code

Example 3: Array substitution splice()– a combination of delete and insert items. You can point to a specified position and insert any number of items and delete any number of items at the same time by specifying three specified arguments: the starting position, the number of items to delete, and any number of items to insert. The number of inserted items need not be equal to the number of deleted items. Syntax: arr. Splice (starting point, length of number to replace, element to replace) [e.g. Splice (2,2, “a”, “b”) deletes items at position 2 of the current array and inserts strings “a” and “b” from position 2. html:

</li> <ul> <ul> <li><span>var arr=[1,2,3,4,5] </span>< /span> &nbsp; </li> </ul>Copy the code

js:

btn[8].onclick = functionVar arr = [1,2,3,4,5] arr.'a'.'b'Alert (arr) //1,2,a,b,5}// add 2 bits after the second elementCopy the code

Concat (); join();

The concat () method concatenates two or more strings. This method does not change the original string, but returns a new string syntax for concatenating two or more strings: string.concat(string1, string2… , stringX) HTML:

Connection < ul > < li > array concat < / li > < li > < span > var a = [1, 2, 3]. Var b=[4,5,6] </span>< /button> &nbsp; </li> </ul>Copy the code

js:

btn[9].onclick = function(){var a = [1,2,3] var b = [4,5,6] var arr = a.concat(b) {var a = [1,2,3] var arr = a.concat(b)Copy the code

The **join () * method is used to put all the elements of an array into a string. Grammar: arrayObject. Join (separator)

html:

< ul > < li > to case 2, array join < / li > < li > < span > var a = [6] < / span > < button > use - links < / button > & have spent </li> </ul>Copy the code

js:

btn[10].onclick = function(){var a = [1,2,3,4,5,6]The '-')// Use delimiters to separate elements in the array alert(a.jin (The '-')) / / 1-2-3-1-2-3}Copy the code