首頁 >web前端 >js教程 >如何在 Javascript 中檢測文字中的單字點擊而不進行類別解析?

如何在 Javascript 中檢測文字中的單字點擊而不進行類別解析?

Linda Hamilton
Linda Hamilton原創
2024-10-27 09:35:03895瀏覽

How to Detect Word Clicks Within Text in Javascript Without Class Parsing?

在不進行類解析的情況下檢測文本中的單字點擊

在Javascript 中,準確檢測文本中的單字點擊可能具有挑戰性。一種常見但效率低下的方法涉及對整個 HTML 文件進行類別解析,並添加

但是,現在可以使用更精細的解決方案:

使用視窗選擇API

Window Selection API 提供了一種檢索當前選定文本的方法。利用此 API,我們可以實現點擊偵測機制,而無需進行大量的 HTML 解析。

這是一個 Javascript 片段:

<code class="javascript">$(".clickable").click(function(e) {
  s = window.getSelection();
  var range = s.getRangeAt(0);
  var node = s.anchorNode;

  // Find starting point
  while (range.toString().indexOf(" ") != 0) {
    range.setStart(node, range.startOffset - 1);
  }
  range.setStart(node, range.startOffset + 1);

  // Find ending point
  do {
    range.setEnd(node, range.endOffset + 1);
  } while (
    range.toString().indexOf(" ") == -1 &&
    range.toString().trim() != ""
  );

  // Alert result
  var str = range.toString().trim();
  alert(str);
});</code>

在此片段中,我們使用點擊偵聽器來啟動選擇API。透過分析選擇的開始和結束位置,我們可以提取點擊的單字。

瀏覽器 API 注意事項

此解決方案相容於 Webkit、Mozilla 和 IE9 。如果您打算將其用作瀏覽器擴展,請確保您的目標瀏覽器支援底層 API。

突出顯示替代方案

作為替代方案,考慮使用文字突出顯示功能而不是點擊可能會提供更直接的使用者體驗。

以上是如何在 Javascript 中檢測文字中的單字點擊而不進行類別解析?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn