Получить родительский узел блока HTML с помощью JavaScript

Question

У меня есть блок HTML:

<div style="text-align:left">
    <span>aaaaa</span>
    <span>bbbbb</span>
    <span>ccccc</span>
    <span>ddddd</span>
</div>

В моем редакторе, когда я пытаюсь выбрать этот div, я получаю только выбранные промежутки, но не div.Итак, мой выбор с этим кодом:

 sel = parent.document.getElementById('frame').contentWindow.document.getSelection();
 var range = sel.getRangeAt (0);
 var docFragment = range.cloneContents ();
 var tmpDiv = document.createElement ("div");
 tmpDiv.appendChild (docFragment);
 selHTML = tmpDiv.innerHTML;

, поэтому, когда я предупреждаю (selHTML), я получаю код с интервалами, которые я написал в начале.Но этот HTML обернут div.Как я могу получить этот div?

Я хочу это, потому что я хочу сделать execCommand вручную для aligment.Потому что в Firefox я использую execCommand, но он не работает должным образом, так как выбор не сделан правильно, и вместо изменения выравнивания текста в div, который у меня уже есть, он добавляет новый div.

Заранее спасибо

Answer 1

Я думаю, что вы хотите externalHTML, который должен включать div и все его содержимое.

selHTML = tmpDiv.outerHTML;

Или

sel = parent.document.getElementById('frame')
  .contentWindow.document.getSelection();  

var range = sel.getRangeAt (0);  
var docFragment = range.cloneContents();  
var tmpDiv1 = document.createElement("div"); 
var tmpDiv2 = document.createElement('div'); 
tmpDiv2.appendChild (docFragment); 
tmpDiv1.appendChild(tmpDiv2); 
selHTML = tmpDiv1.innerHTML; 

Answer 2

В Firefox вы можете использовать commonAncestorContainer свойство диапазона.Итак, в вашем случае:

var range = sel.getRangeAt(0);
var container = range.commonAncestorContainer;

if (container && container.tagName === "div" && container.style.textAlign) {
    // it's a div tag with an inline style text-align prop

    // you can also modify the container directly:
    container.style.textAlign = "center";
}

Answer 3

Вы пробовали setHTML.parentNode?