<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no, minimal-ui, viewport-fit=cover">
<title>Document</title>
<style>
body {
user-select: auto
}
</style>
</head>
<body>
<p id="selectableText">5这段文字需要被自动选中这段文字需要被自动选中这段文字需要被自动选中这段文字需要被自动选中这段文字需要被自动选中</p>
<button onclick="selectParagraph()">选中段落</button>
<script>
function selectParagraph() {
const element = document.getElementById("selectableText");
if (document.body.createTextRange) { // IE兼容方案
const range = document.body.createTextRange();
range.moveToElementText(element);
range.select();
} else { // 现代浏览器方案
const selection = window.getSelection();
const range = document.createRange();
range.selectNodeContents(element);
selection.removeAllRanges();
selection.addRange(range); // 创建选区对象[1,5](@ref)
}
}
</script>
</body>
</html>
index.html
index.html