这篇文章主要介绍了向 JavaScript 的数组中添加元素的方法小结, 分别举了一些 JS 数组操作的例子, 基本需要的朋友可以参考下
Javascript 是一种由 Netscape 的 LiveScript 发展而来的原型化继承的基于对象的动态类型的区分大小写的客户端脚本语言,主要目的是为了解决服务器端语言,比如 Perl,遗留的速度问题,为客户提供更流畅的浏览效果。
在数组的开头添加新元素 - unshift()
源代码:
- <!DOCTYPE html>
- <html>
- <body>
- <p id="demo">
- Click the button to add elements to the array.
- </p>
- <button onclick="myFunction()">
- Try it
- </button>
- <script>
- function myFunction() {
- var fruits = ["Banana", "Orange", "Apple", "Mango"];
- fruits.unshift("Lemon", "Pineapple");
- var x = document.getElementById("demo");
- x.innerHTML = fruits;
- }
- </script>
- <p>
- <b>
- Note:
- </b>
- The unshift() method does not work properly in Internet Explorer 8 and
- earlier, the values will be inserted, but the return value will be
- <em>
- undefined
- </em>
- .
- </p>
- </body>
- </html>
测试结果:
- Lemon,
- Pineapple,
- Banana,
- Orange,
- Apple,
- Mango
在数组的第 2 位置添加一个元素 - splice()
源代码:
- <!DOCTYPE html>
- <html>
- <body>
-
- <p id="demo">
- Click the button to add elements to the array.
- </p>
-
- <button onclick="myFunction()">
- Try it
- </button>
-
- <script>
- function myFunction() {
- var fruits = ["Banana", "Orange", "Apple", "Mango"];
- fruits.splice(2, 0, "Lemon", "Kiwi");
- var x = document.getElementById("demo");
- x.innerHTML = fruits;
- }
- </script>
-
- </body>
- </html>
测试结果:
- Banana,
- Orange,
- Lemon,
- Kiwi,
- Apple,
- Mango
数组的末尾添加新的元素 - push()
源代码:
- <!DOCTYPE html>
- <html>
- <body>
-
- <p id="demo">
- Click the button to add a new element to the array.
- </p>
-
- <button onclick="myFunction()">
- Try it
- </button>
-
- <script>
- var fruits = ["Banana", "Orange", "Apple", "Mango"];
- function myFunction() {
- fruits.push("Kiwi") var x = document.getElementById("demo");
- x.innerHTML = fruits;
- }
- </script>
-
- </body>
- </html>
测试结果:
- Banana,
- Orange,
- Apple,
- Mango,
- Kiwi
来源: http://www.phperz.com/article/17/0227/269008.html