HTMLを変更せずにテキスト内でクリックされた単語を検出するにはどうすればよいですか?

クリック イベント ベースの単語検出

Web 開発では、テキスト内でクリックされた単語を識別することが対話型アプリケーションにとって不可欠な場合があります。一般的なアプローチの 1 つは、HTML を解析し、jQuery を使用してクリックを検出し、単語のテキストを取得することにより、各単語をspan要素でラップすることです。ただし、このソリューションは非効率的で、見た目にも魅力的ではありません。

プロセスを強化するために、HTML を大量に変更する必要をなくす代替方法が利用可能です。このソリューションは、Webkit、Mozilla、IE9 などの最新のブラウザーでサポートされているセレクション API を利用します。

提供されている JavaScript 実装 (https://jsfiddle.net/Vap7C/15/) により、以下を通じて単語検出が可能になります。手順:

1. ターゲット テキスト要素のクリック イベント ハンドラーを定義します。
2. getSelection() メソッドを使用して、現在のテキスト選択を取得します。
3. 範囲を作成するオブジェクトを使用して、テキスト内の単語の開始位置と終了位置を決定します。
4. テキストを反復処理して、空白に基づいて単語の開始位置を見つけます。
5. 範囲を拡張して単語の終了位置を見つけます。
6. 選択したテキストをトリミングし、クリックされた単語として表示します。

この方法では、大規模な作業を必要とせず、クリックベースの単語検出をより高速かつクリーンに実装できます。 HTML の変更または外部ブラウザー API。さまざまなブラウザで効果的に動作し、対話型のテキストベースのアプリケーションに信頼性の高いソリューションを提供します。

以上がHTMLを変更せずにテキスト内でクリックされた単語を検出するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。