JS 实现一键复制功能

JavaScript015

JS 实现一键复制功能,第1张

复制是一个使用频率特别高的操作，在网页中，一般可以选中要复制的内容，使用快捷键ctrl+c 将内容复制到剪贴板。除了使用系统提供的快捷方式复制网页内容，我们还可以用JS实现复制，这得益于document的execCommand('copy') 命令。

我们可以通过表单元素的select()方法选中内容，表单元素因为textarea限制少于input，所以推荐使用textarea。我们可以动态创建一个textarea元素，将textarea的value属性值设置为上面的innerText属性值，再执行textarea的select方法选中。

上面实现了选中，下面就可以实现复制功能了。

最后一步就可以用execCommand('copy')实现复制了，它可以复制浏览器中选中的文本，比如说上面被textarea选中的文本，复制之后记得移除textarea。

第二步和第三步可以优化一下，创建一个copy函数，函数参数设置为第一步需要复制的文本，返回值为复制的结果。

完整JS示例如下：

使用示例

可以将上面的完整JS示例写入一个JS文件，将JS文件引入HTML中，通过JS点击事件来执行复制函数。

1. 图片调用的js文件怎么写

将需要在js中修改的代码放在js变量中，该变量在js中定义，然后在insertHtml中添加这段代码，示例如下：

var code = "<a herf = '#'><img url = '#'></img></a>"

insertHtml("beforeend",document.body,code)

将包含上述代码的js引入到页面中即可，在页面上调用js的代码如下：

<script language=javascript src=test.js></script>

insertHtml的使用方法：

insertHtml(where,el,html)

where：插入位置。包括beforeBegin,beforeEnd,afterBegin,afterEnd

el：用于参照插入位置的html元素对象

html；要插入的html代码

例：insertHtml("beforeEnd",document.getElementById("fav_list"),"<li id='aaa'><a href='' class='fav_link'>；百度</a></li>")

2. 如何利用JS插入图片

简单代码如下：

使用JS在Div中插入图片

<div id="ad"></div>

<script type=text/javascript language="javascript">

var img = document.createElement("img")

img.setAttribute("src", "images/bb.")

var a = document.createElement("a")

a.setAttribute("href", "文件里面

在HTML中加入JavaScript脚本JavaScript采用的格式如下：把上述语句放在HTML的与之间，也可放在<body>与之 间。

将JavaScript标识放置… 在头部之间，使之在主页和其余部分代码之前装载，从而可使代码的功能更强大；将JavaScript标识放置 在<body>… 主体之间以实现某些部分动态地创建文档。例子：在网页上显示“你好！”。

<body>在浏览器地址栏直接执行JavaScript脚本也可以在浏览器的地址栏中输入JavaScript语句，由浏览器直接执行。如输入：javascript:alert(200*75)四、调用JavaScript文件可以将纯JavaScript的语句另外保存在一个"*.js"的文件中，需要时再调用。

例子：调用test.js文件，显示提示。<body>调用test.js文件test.js的文件内容如下：alert（"这是被调用的语句。

"）。

4. 怎样用js代码引入本地图片的路径

1、本地的图片？HTML只能连接网站内的图片，即使在本地，也需要先将图片拷贝到网站内。

2、网页中引用js文件，象你这样如果用到图片路径等时，要注意的是这个路径如果用相对路径表示的话，是网页与图片之间的相对路径，而不是js文件与图片之间的相对路径。如果有多个不同的目录中的网页文件需要引用一个这样的js文件的话，最好的解决办法是用绝对路径。也就是改成：

imgUrl1=("/images/0.")

imgtext1="1111"

imgLink1=escape("/XX")

imgUrl2=("/images/00.")

imgtext2="222"

imgLink2=escape("/XXX")