JavaScriptでカーソル下の単語を取得する方法は？

質問

例えば、以下のような場合

<p> some long text </p>

私のHTMLページで、マウスのカーソルが例えば'text'という単語の上にあることを知るにはどうしたらよいでしょうか？

どのように解決するのですか？

他の2つの回答に加えて、jQuery（または一般的なjavascript）を使用して、段落をスパンに分割することができる場合があります。

そうすれば、単語の周りにスパンがあるテキストを出力することについて考える必要はありません。 javascriptがそれをやってくれます。

など。

<p>Each word will be wrapped in a span.</p>
<p>A second paragraph here.</p>
Word: <span id="word"></span>

<script type="text/javascript">
    $(function() {
        // wrap words in spans
        $('p').each(function() {
            var $this = $(this);
            $this.html($this.text().replace(/\b(\w+)\b/g, "<span>$1</span>"));
        });

        // bind to each span
        $('p span').hover(
            function() { $('#word').text($(this).css('background-color','#ffff66').text()); },
            function() { $('#word').text(''); $(this).css('background-color',''); }
        );
    });
</script>

上記のコードは、動作はしますが、段落タグの中のhtmlが取り除かれることに注意してください。

jsFiddleの例