JavaScript实现数组在指定位置插入若干元素的方法
本文实例讲述了JavaScript实现数组在指定位置插入若干元素的方法。分享给大家供大家参考。具体如下:
我们可以通过JS数组的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
希望本文所述对大家的javascript程序设计有所帮助。
相关推荐
-
Javascript中找到子元素在父元素内相对位置的代码
经过自己一晚上尝试,貌似找到了一个方法. 现在脑袋还糊涂,先记下来,以后再分析. 复制代码 代码如下: // 找到子元素在父元素中的相对位置 function getElementTop(element){ var el = (typeof element == "string") ? document.getElementById(element) : element; if (el.parentNode === null || el.style.display == 'none')
-
javascript 获取元素位置的快速方法 getBoundingClientRect()
它返回一个对象,其中包含了left.right.top.bottom四个属性,分别对应了该元素的左上角和右下角相对于浏览器窗口(viewport)左上角的距离. 所以,网页元素的相对位置就是 var X= this.getBoundingClientRect().left; var Y =this.getBoundingClientRect().top; 再加上滚动距离,就可以得到绝对位置 var X= this.getBoundingClientRect().left+document.doc
-
javascript 精确获取页面元素的位置
复制代码 代码如下: //取得元素x坐标 function pageX(elem) { return elem.offsetParent?(elem.offsetLeft+pageX(elem.offsetParent)):elem.offsetLeft; } //取得元素y坐标 function pageY(elem) { return elem.offsetParent?(elem.offsetTop+pageY(elem.offsetParent)):elem.offsetTop; } 貌
-
JavaScript获取指定元素位置的方法
本文实例讲述了JavaScript获取指定元素位置的方法.分享给大家供大家参考.具体如下: 复制代码 代码如下: function showpane() { var self = document.getElementById("eID"); var left = self.getBoundingClientRect().left + document.documentElement.scrollLeft; var top = self.getBoundingClientR
-
用Javascript 获取页面元素的位置的代码
下面的教程总结了Javascript在网页定位方面的相关知识. 一.网页的绝对大小和相对大小 首先,要明确两个基本概念. 一张网页的全部面积,就是它的绝对大小.通常情况下,网页的绝对大小由内容和CSS样式表决定. 网页的相对大小则是指在浏览器窗口中看到的那部分网页,也就是浏览器窗口的大小,又叫做viewport(视口). 下图中央的方框就代表浏览器窗口,每次只能显示一部分网页. (图一 网页的绝对大小和相对大小) 很显然,如果网页的内容能够在浏览器窗口中全部显示(也就是不出现滚动条),那么网页的
-
用Javascript获取页面元素的具体位置
制作网页的过程中,你有时候需要知道某个元素在网页上的确切位置. 下面的教程总结了Javascript在网页定位方面的相关知识. 一.网页的大小和浏览器窗口的大小 首先,要明确两个基本概念. 一张网页的全部面积,就是它的大小.通常情况下,网页的大小由内容和CSS样式表决定. 浏览器窗口的大小,则是指在浏览器窗口中看到的那部分网页面积,又叫做viewport(视口). 很显然,如果网页的内容能够在浏览器窗口中全部显示(也就是不出现滚动条),那么网页的大小和浏览器窗口的大小是相等的.如果不能全部显示,
-
用JavaScript获取DOM元素位置和尺寸大小的方法
在一些复杂的页面中经常会用JavaScript处理一些DOM元素的动态效果,这种时候我们经常会用到一些元素位置和尺寸的计算,浏览器兼容性问题也是不可忽略的一部分,要想写出预想效果的JavaScript代码,我们需要了解一些基本知识. 基础概念 为了方便理解,我们需要了解几个基础概念,每个HTML元素都有下列属性 offsetWidth clientWidth scrollWidth offsetHeight clientHeight scrollHeight offsetLeft clientL
-
javascript getBoundingClientRect() 来获取页面元素的位置的代码[修正版]第1/2页
document.documentElement.getBoundingClientRect下面这是MSDN的解释: Syntax oRect = object.getBoundingClientRect()Return Value Returns a TextRectangle object. Each rectangle has four integer properties (top, left, right, and bottom) that represent a coordinate
-
JavaScript中的noscript元素属性位置及作用介绍
一.<script>元素属性 向XHTML页面中插入JavaScript的主要方法,就是使用<script>元素,该元素有5个属性分别为charset.defer.language.src.type,经常使用的是type.src.defer这三个. 1.type属性的值一般都是text/javascript,该属性是必须的,<script type="text/javascript"/>. 2.src属性的值是*.js外部文件,该属性是可选的,<
-
JavaScript实现数组在指定位置插入若干元素的方法
本文实例讲述了JavaScript实现数组在指定位置插入若干元素的方法.分享给大家供大家参考.具体如下: 我们可以通过JS数组的splice方法在执行的位置插入新的元素,非常简单 <!DOCTYPE html> <html> <body> <p id="demo"> Click the button to add elements to the array. </p> <button onclick="myFu
-
Java之数组在指定位置插入元素实现
1.假设在已知数组中在指定位置添加一个元素,那么在这位置的数据元素就会被替换掉. 代码: public class InsertArray { public static void main(String[] args) { int index = 2; int value = 5; int[] array = new int[]{1,2,3,4}; array[index] = value; System.out.println(Arrays.toString(array)); } } 测试结
-
JavaScript talbe表中指定位置插入一行的实现代码 脚本之家修正版
最近在学JavaScript,下面是我自己做的一个例子(在w3cschool例子的基础上) 该例子实现功能是在鼠标点击的行之后插入一行,默认是在第一行插入.插入的内容可以自己输入,代码如下 //global var var pos =0 //to find the position you mouse has pressed function whichElement(e) { var targ if (!e) var e = window.event if (e.target) targ =
-
JS在可编辑的div中的光标位置插入内容的方法
本文实例讲述了js实现在可编辑div中指定位置插入内容的方法,就像我们使用的编辑器一样,分享给大家供大家参考.具体实现方法如下: 首先要让DIV启用编辑模式 复制代码 代码如下: <div contenteditable=true id="divTest"></div> 通过设定contenteditable=true开启div的编辑模式.这样DIV就可以跟文本框一样输入内容了. 不扯话题了.下面说怎么获取或设置光标位置. 2个步骤: ① 获取DIV中的光标位置
-
在JS数组特定索引处指定位置插入元素的技巧
如何在JS数组特定索引处指定位置插入元素? 需求: 将一个元素插入到现有数组的特定索引处.听起来很容易和常见,但需要一点时间来研究它. // 原来的数组 var array = ["one", "two", "four"]; // splice(position, numberOfItemsToRemove, item) // 拼接函数(索引位置, 要删除元素的数量, 元素) array.splice(2, 0, "three"
-
JS如何在数组指定位置插入元素
一.JavaScript splice() 方法 splice() 方法向/从数组中添加/删除项目,然后返回被删除的项目. 方法实例 //在数组指定位置插入 var fruits = ["Banana", "Orange", "Apple", "Mango"]; fruits.splice(2, 0, "Lemon", "Kiwi"); //输出结果 //Banana, Orange,
-
JS 在数组指定位置插入/删除数据的方法
splice() 方法向/从数组中添加/删除项目,然后返回被删除的项目. 语法 arrayObject.splice(index,howmany,item1,.....,itemX) 参数说明 参数 描述 index 必需.整数,规定添加/删除项目的位置,使用负数可从数组结尾处规定位置. howmany 必需.要删除的项目数量.如果设置为 0,则不会删除项目. item1, -, itemX 可选.向数组添加的新项目. 实例 添加一个元素 var array = [1,2,3,4,6]; ar
-
PHP实现数组向任意位置插入,删除,替换数据操作示例
本文实例讲述了PHP实现数组向任意位置插入,删除,替换数据操作.分享给大家供大家参考,具体如下: array_splice函数可以实现任意位置插入和删除,替换 array array_splice ( array &$input , int $offset [, int $length = count($input) [, mixed $replacement = array() ]] ) offset 如果 offset 为正,则从 input 数组中该值指定的偏移量开始移除.如果 offse
-
jQuery实现在textarea指定位置插入字符或表情的方法
本文实例讲述了jQuery实现在textarea指定位置插入字符或表情的方法.分享给大家供大家参考.具体实现方法如下: 1. 函数定义 复制代码 代码如下: (function($){ $.fn.extend({ insertAtCaret: function(myValue){ var $t=$(this)[0]; if (document.selection) { this.focus()
-
C#实现winform中RichTextBox在指定光标位置插入图片的方法
本文实例讲述了C#实现winform中RichTextBox在指定光标位置插入图片的方法.分享给大家供大家参考,具体如下: //获取RichTextBox控件中鼠标焦点的索引位置 int startPosition = this.richTextBox1.SelectionStart; //从鼠标焦点处开始选中几个字符 this.richTextBox1.SelectionLength = 2; //清空剪切板,防止里面之前有内容 Clipboard.Clear(); //给剪切板设置图片对象
随机推荐
- AngularJS实现的输入框字数限制提醒功能示例
- docker容器如何优雅的终止详解
- 微信小程序版的知乎日报开发实例
- 基于Ajax用户名验证、服务条款加载、验证码生成的实现方法
- 合并ThinkPHP配置文件以消除代码冗余的实现方法
- 用PHP与XML联手进行网站编程代码实例
- JavaScript中Math.SQRT2属性的使用详解
- JSON.parse 解析字符串出错的解决方法
- java中文转全拼工具类分享
- C#读取xml节点数据方法小结
- mysql自增ID起始值修改方法
- android BitmapFactory.Options使用方法详解
- .Net笔记:System.IO之Stream的使用详解
- Android App中使用SurfaceView制作多线程动画的实例讲解
- Android实现Ant Design 自定义表单组件
- 自增长键列统计信息的处理方法
- 实现mysql级联复制的方法示例
- SpringCloud微服务架构升级汇总
- python的移位操作实现详解
- 易语言开发上网导航步骤教学