php div点击时默认选中,js实现鼠标点击自动选中点击元素内的文字

最近需要在页面上实现一个点击元素(p、div等等)内文字，文字自动选中的效果，找了一圈最后终于实现了，现总结如下：

1、如果是要选中输入框(input、textarea)内的文字，代码如下：

自动选择文本框/编辑框中的文字

选中textarea文字

原版地址： https://www.jb51.net/article/71317.htm

具体原理不清楚，需要的同学可以直接把代码粘到(菜鸟教程在线编辑器：https://www.runoob.com/try/try.php?filename=tryjs_events)进行测试。注意点是：form表单需要对name属性赋值，需要选中的元素也要对name属性赋值

2、如果需要选中的文本是普通元素(div、p、span之类)，代码如下：

自动选择文本框/编辑框中的文字

需要选中的文字

参考链接：https://developer.mozilla.org/en-US/docs/Web/API/Range/selectNodeContents

需要的同学可以直接把代码粘到(菜鸟教程在线编辑器： https://www.runoob.com/try/try.php?filename=tryjs_events)进行测试。

简单解释一下：Selection：通过window对象获取一个selection对象，表示用户选择的文本范围或插入符的当前位置；

Range：表示一个包含节点与文本节点的一部分的文档片段；而 range.selectNodeContents(dom) 则是使range对象包含dom节点的内容

最后使用 selection.addRange(range);方法 把当前元素内的文字选中。

THE END~ 希望能有所帮助