网站建设和程序开发哪个好,制作网页需要哪些技术,鹤壁市建设局网站,seo收费标准1. 定义复制拷贝的方法
在某个工具类方法中定义该方法#xff0c;兼容不同浏览器处理
/*** description 拷贝的类方法*/
class CopyClass {// constructor() {}setRange(input) {return new Promise((resolve, reject) {try {// 创建range对象const range document.c…1. 定义复制拷贝的方法
在某个工具类方法中定义该方法兼容不同浏览器处理
/*** description 拷贝的类方法*/
class CopyClass {// constructor() {}setRange(input) {return new Promise((resolve, reject) {try {// 创建range对象const range document.createRange();// 获取复制内容的 id 选择器range.selectNode(input);// 创建 selection对象const selection window.getSelection();// 如果页面已经有选取了的话会自动删除这个选区没有选区的话会把这个选取加入选区if (selection.rangeCount 0) {selection.removeAllRanges();} else {//}// 将range对象添加到selection选区当中会高亮文本块selection.addRange(range);resolve();} catch (error) {reject(error);}});}createInput(val) {return new Promise((resolve, reject) {try {const input document.createElement(input); // 创建input对象input.type hidden;input.value val;resolve(input);} catch (error) {reject(error);}});}execCommand() {return new Promise((resolve, reject) {try {// 该方法已弃用document.execCommand(Copy);resolve();} catch (error) {reject(error);}});}inputSelectCopy(input) {return new Promise((resolve, reject) {try {document.body.appendChild(input);input.select(); // 选择对象;this.execCommand().then(() {input.remove();resolve();}).catch(e {reject(e);});} catch (error) {reject(error);}});}clipboardWriteText(val) {return new Promise((resolve, reject) {try {navigator.clipboard.writeText(val).then(res {resolve();}).catch(e {reject(e);});} catch (error) {reject(error);}});}copy(val) {return new Promise((resolve, reject) {if (val typeof val string) {const errorObj new Error(页面复制内容失败);this.clipboardWriteText(val).then(res {resolve();}).catch(e {this.createInput(val).then(res {this.setRange(res).then(() {this.execCommand().then(() {resolve();}).catch(e {reject(errorObj);});}).catch(e {this.inputSelectCopy(res).then(() {resolve();}).catch((e) {reject(errorObj);});});}).catch(e {reject(errorObj);});});} else {reject(new Error(不能复制无效内容));}});}
}/*** description 拷贝*/
export function copy(val) {const copyClass new CopyClass();return copyClass.copy(val);
}2. 实际调用
import copy from /utils/index;copy(需要拷贝的内容).then((res) {// 成功提示
}).catch(e {// 报错提示
});3. 涉及方法
document.createRange: 返回一个 Range 对象。selectNode: Range.selectNode() 方法将 Range 设置为包含整个 Node 及其内容。Range 的起始和结束节点的父节点与 referenceNode 的父节点相同。window.getSelection: 返回一个 Selection 对象表示用户选择的文本范围或光标的当前位置。removeAllRanges: 从Selection对象里移除Range对象。addRange: 将一个Range对象添加到Selection对象中。document.execCommand: 当一个 HTML 文档切换到设计模式时document暴露 execCommand 方法该方法允许运行命令来操纵可编辑内容区域的元素。这里我们使用copy命令来复制所选内容。 需要注意的是该方法已经被弃用了navigator.clipboard.writeText: Clipboard 接口的 writeText() 方法可以写入特定字符串到操作系统的剪切板, 该方法返回一个关于执行情况的Promise。