Question

我想在某些div中自动选择文本（我的意思是使用Ranges），以便在JS中对我的脚本进行单元测试。

我的问题是，我希望能够以不同的方式选择文本，这里有一些选择的例子（选择由[开始和]表示结束）

<div>[ here I select all the text in the div ]</div

<div>This is just a <b>piece [ of</b> selection]</div>

<div><ul><li>Also with [list</li><li>And why not select many items ?</li></ul><p>With a p ?] but not the complete p !</p>

我想这样做，因为用户可以这样做，所以我应该测试每个使用情况。（如果我不这样做，那么单元测试就没用了......）

你对如何选择我想要的东西有所了解吗？（如果可能的话......）

Answer 1

我在网上发现了这个。

这个函数在调用特定HTML元素时会自动选择其所有内部文本。该函数适用于INPUT（文本），TEXTAREA，DIV，SPAN，TD和PRE等元素。跨浏览器兼容。

var autoSelect = function(event) {
  var event = event || window.event, 
      elem = event.target || event.srcElement, 
      tag = (elem.tagName || "").toLowerCase(), 
      sel, range;

  if (tag === "textarea" || tag === "input") {
    try {
      elem.select();
    } catch(e) {
      // May be disabled or not selectable
    }
  } else if (window.getSelection) { // Not IE
    sel = window.getSelection();
    range = document.createRange();
    range.selectNodeContents(elem);
    sel.removeAllRanges();
    sel.addRange(range);
  } else if (document.selection) { // IE
    document.selection.empty();
    range = document.body.createTextRange();
    range.moveToElementText(elem);
    range.select();
  }
};

将此功能附加到元素：

document.getElementById("foobar").onclick = autoSelect;

Answer 2

您可以使用正则表达式执行此操作：

var divStr = document.getElementById('yourDiv').innerHTML;
var matchs = /\[(.*?)\]/.exec(divStr);
console.log(matchs[1]);

我们获取内部html字符串，然后解析[]之间的所有内容，并最终得到分组内容。

使用JS在html页面中选择一些文本

2 个答案: