jquery - объединяет сложенные элементы DOM - PullRequest
Новая
       9

jquery - объединяет сложенные элементы DOM

1 голос
/ 14 февраля 2012

У меня есть HTML, который был отформатирован через contenteditable div. Я хочу сделать его более лаконичным, современным HTML. Я могу легко заменить любые теги b, strong, em, font и т.д. и заменить их на span, но в результате получаются «сложенные» элементы.

Например, я мог бы иметь: 

<span style="font-weight:bold">
    <span style="text-decoration:underline">some text</span>
</span>

И я хочу увидеть: 

<span style="font-weight:bold; text-decoration:underline">some text</span>

Тяжелая часть, с которой нужно будет справиться: 

<span style="font-weight:bold">
    <span style="text-decoration:underline">some text</span> not underlined
</span>

Я довольно долго искал и думал об этом, но не нашел ничего разумного.

1 Ответ

0 голосов
/ 15 февраля 2012

Ну, вот и начало.Очевидно, ваш селектор будет более конкретным, чем просто span. 

$("span").each(function(){
    var $this = $(this);
    var $contents = $(this).contents();

    if($contents.length === 1 && $contents.is("span")){
        // only one child (including text nodes) and it is a span, combine
        copyStylesFromParentToChild();  // need to implement this

        $this.replaceWith($this.children());  // replace the parent with the child
    }
});

Единственная сложная часть здесь - copyStylesFromParentToChild.Я не знаю простого и простого способа скопировать все стили из одного элемента в другой.Вы можете попробовать JavaScript и стиль копирования

...