現在のカーソル位置を囲む単語のスタイルを取得する

Question

現在のカーソル位置の下にある単語のスタイル/太字、斜体などを取得しようとしています。 私はクリックのxとy COORDを持っていると私は、次の

var range = document.caretRangeFromPoint(x, y); 
range.expand('word'); 
range.queryCommandState('bold'); 

をやったが、これは、その範囲は、この読みながらqueryCommandState方法を持っていないエラーにつながる：http://help.dottoro.com/ljkxwclp.phpは、その範囲または少なくともテキストの範囲を意味します（私はJS初心者ですので、それについて私に赦してください）そのような方法があります。どんな助けでも大歓迎です。

編集：私はちょっと

​​

を追加することでこれを回避するが、私はそれで非常に満足していません。これを達成するより良い方法はありますか？

Answer 1

多くのコードを書くことなく、あなたが持っているものよりも優れたことはできないと思います。 IEの独自のTextRangeにはqueryCommandState()という関連メソッドがありますが、これは他のブラウザでは決してRangeにはなりません。

大胆なテストを行うために選択を破棄する必要があることに満足できない場合は、不必要に複雑で厄介なようですが、選択を元の状態に復元するのは簡単です。また、選択を空にする標準ベースの方法は、empty()（WebKit固有）ではなくremoveAllRanges()です。

デモ：http://jsfiddle.net/GkWTb/1/

コード：あなたは、そのページ上の例に従えば

var range = document.caretRangeFromPoint(x, y); 
var sel = window.getSelection(); 
var selRange; 

// Save initial selection 
if (sel.rangeCount > 0) { 
    selRange = sel.getRangeAt(0); 
} 
range.expand("word"); 
sel.removeAllRanges(); 
sel.addRange(range); 
alert(document.queryCommandState("bold")); 

// Restore original selection 
sel.removeAllRanges(); 
if (selRange) { 
    selRange = sel.addRange(selRange); 
}