使用contentEditable時，如何使用Javascript獲得脫字符所在的元素？

<body contentEditable="true"> 
    <h1>Some heading text here</h1> 
    <p>Some text here</p> 
</body>

現在插入符號（閃爍的光標）H1元素裏面閃爍，讓我們在「標題」字說。如何使用JavaScript獲取插入符號的元素名稱？在這裏我想獲得「h1」。

這隻需要在WebKit中工作（它嵌入在應用程序中）。它最好也適用於選擇。

2009-07-29 Lucas

首先，想想爲什麼你這樣做。如果您試圖阻止用戶編輯某些元素，請在這些元素上將contenteditable設置爲false。

但是，有可能做你所要求的。下面的代碼在Safari 4中工作，並將返回選擇所錨定的節點（即，用戶開始選擇，選擇「向後」將返回結束而不是開始） - 如果您希望元素類型爲字符串，只需獲取返回節點的nodeName屬性即可。這也適用於零長度選擇（即只是插入位置）。

function getSelectionStart() { 
    var node = document.getSelection().anchorNode; 
    return (node.nodeType == 3 ? node.parentNode : node); 
}

2009-07-31 11:13:35 You

我不想以任何方式阻止用戶，我真的只需要節點的名稱，以便我可以更新UI的一部分。謝謝你提供的答案，這很好。 – Lucas 2009-07-31 11:58:37

回答