Javascript: получить брат текущего элемента [необходим для CKEditor]

Question

Эй, я работаю над простым плагином для CKEditor, я не имею дело с JavaScript, поэтому вот моя проблема.

Я загружаю изображение и вставляю его с помощью диалога, производя что-то вроде этого.

<div class="float-right image">  
<img alt="alt-text" src="img.jpg" />   
<span class="caption">Caption</span>  
</div>

Работает как брелок, но как только я вставлю его, я хочу иметь возможность редактировать его.Таким образом, я могу получить атрибут alt и источник изображения через

var elem = this.getParentEditor().getSelection().getSelectedElement();

и работать с getAttribute ('...').Но я не могу понять, как достичь, подпись и div.

Я был бы очень рад, если бы вы могли мне помочь.Заранее спасибо.

Кстати: есть ли возможность использовать jquery в плагине для CKEditor?

Вот решение:

Итак, что я придумала в концеСпасибо всем за помощь здесь.В диалоговой части:

onShow : function()
{
elem = this.getParentEditor().getSelection().getSelectedElement();
var span = elem.getNext();
var parent = span.getParent();
}

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

, чтобы отправить все, что мне нужно, чтобы узнать, как изменитьтекущий выбор.Это работает так:

onOk:
function()
    {
editor.getSelection().selectElement(editor.getSelection().getSelectedElement().getParent());
editor.insertHtml('<div ...</div>');
}

Спасибо, ребята, я только начал копаться в плагинах CKEditor сегодня и уже получил два хороших.

Answer 1

С CKEditor API вы можете использовать .getNext ()

Answer 2

Существует Element.nextElementSibling, который поддерживается в IE9 +, Fx3.5 +, Op, Saf и Chrome (не знаю версии за последние три, но довольно долго).

Answer 3

Да, вы можете использовать jQuery в плагине CKEditor, если вы не собираетесь распространять плагин (другие люди могут не иметь jQuery), и в этом случае ваше решение становится:

$(elem).next('span') и $(elem).prev('div')

Если вы не хотите использовать jQuery, у вас есть .nextSibling и .previousSibling

Обратите внимание, однако, что следующий и предыдущий братья и сестры часто будут textNodes в зависимости от того, в каком браузере вы находитесь. Поэтому, чтобы получить диапазон, вам нужен цикл:

function getNextSibling(node, type){
    while((node = node.nextSibling) && (node.nodeName != type));
    return node;
}

getNextSibling(elem, 'SPAN');