使用JS在html頁面中選擇一些文本

Question

我想在div中自動選擇文本（我的意思是“范圍”），以便對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字符串，然后解析[]之間的所有內容，最后獲取分組的內容。