使用JavaScript模拟Ctrl + A.

Question

我想以编程方式选择页面上的所有文本,其结果与我按下组合键Ctrl + A的结果完全相同.

使用的问题document.getSelection().selectAllChildren(body)是选择还将包括用户无法选择的文本节点,即CSS中定义的<script> </script>节点user-select:none:

<div style="-moz-user-select:none">将被选中</div>

modify选择对象的方法可以像这样使用: selection.modify("extend", "forward", "documentboundary"); 将选择从文档的开头扩展到结尾,这将忽略任何脚本或样式元素的内容和元素-moz-user-select:none- 遗憾的是Firefox不允许documentboundary作为3.参数和word无济于事.

有没有快速的方法来实现这一目标？只需要在Firefox中工作.

编辑(不太好解决方案):选择第一个文本节点,然后selection.modify('extend', 'forward', 'line')重复使用,selection.focusNode而不等于最后一个文本节点 - 但根据文档的长度,这需要几秒钟!

编辑: selection.selectAllChildren将在Chrome中按预期工作,其中user-select:none不会选择文本元素- 不幸的是,在FF中有不同的行为.

编辑:这不是这篇文章的重复,因为我既不解决contenteditable元素也不关心它们;)

Answer 1

只是要注意，我在这里使用了 jquery，尽管它是用 Javascript 询问的 - 我不确定这是否正是您所寻找的，但也许它可以为您指明正确的方向？如果您需要解释，请告诉我。

function slct(el) {
		    var d = document;
		    var t = d.getElementById(el);
        var selection;
		    var range;
    
		    if(d.body.createTextRange) {
		        range = d.body.createTextRange();
		        range.moveToElementText(t);
		        range.select();
		    } else if(window.getSelection) {
		        selection = window.getSelection();        
		        range = d.createRange();
		        range.selectNodeContents(t);
		        selection.removeAllRanges();
		        selection.addRange(range);
		    }
		}

		$(function() {
		    $('#myButton').click(function() {
		        slct('content');
		    });
		});

<script
		src="https://code.jquery.com/jquery-3.2.1.min.js"
		integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4="
		crossorigin="anonymous">
	</script>

<div id="content">
		<h4>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quam  necessitatibus assumenda nam obcaecati unde libero aspernatur neque ad vel enim tempora, qui consectetur corporis reiciendis, eum dolorum voluptas soluta voluptatibus!</h1>
		<h5>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Eveniet asperiores, iste distinctio sint quidem ea aut voluptatem earum error similique, repudiandae consectetur labore esse. Aut quas repudiandae accusamus non iusto.</h2>
		<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. In rem blanditiis delectus placeat officia, iusto qui! Dicta laboriosam ea exercitationem, molestiae officiis! Asperiores quibusdam laborum in optio eum, similique vitae.</p>
</div>

<button id="myButton">select stuff</button>