Добавление тега класса к дочерним элементам с использованием блочного стиля для родителя (Typo3 6.2.2)

Можно ли сказать синтаксическому анализатору RTE изменить атрибут класса всех прямых дочерних элементов, когда определенный стиль блока добавляется к родительскому элементу?

Изменить 1

Если содержимое RTE примерно такое

<ul>
   <li>Item 1</li>
   <li>Item 2</li>
   <li>Item 3</li>
</ul>

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

<ul class="my-custom-class">
   <li>Item 1</li>
   <li>Item 2</li>
   <li>Item 3</li>
</ul>

RTE должен автоматически добавлять my-custom-sub-class ко всем li-элементам

<ul class="my-custom-class">
   <li class="my-custom-sub-class">Item 1</li>
   <li class="my-custom-sub-class">Item 2</li>
   <li class="my-custom-sub-class">Item 3</li>
</ul>

Редактировать 2 - Обходной путь

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

// jQuery -> https://jsfiddle.net/du6r7ow1/1/
$('ul.my-custom-class > li').addClass('my-custom-sub-class');

// MooTools -> https://jsfiddle.net/u53516cu/
$$('ul.my-custom-class > li').addClass('my-custom-sub-class');

typo3 typoscript rte
person Inceddy    schedule 18.05.2015    source источник
comment
мы говорим об RTE в CMS (например, tinyMCE в WordPress), верно? если да, то это слишком специфическое использование. см. ниже для выбора определенных элементов с помощью CSS.   -  person aequalsb    schedule 18.05.2015

Ответы (1)


arrow_upward
0
arrow_downward

вы можете использовать это вместо этого?

.parent > children будет нацелен ТОЛЬКО на прямых потомков (в частности, divs id=1 и id=2)

.parent > div {
    border:1px dashed red;
}

<div class="parent">
     <div id="1">this div will get targeted
        <div>this div won't get targeted</div>
        <p>jabberwocky</p>
    </div>
    <div id="2">this div will get targeted
        <ul>
            <li></li>
            <li></li>
            <li></li>
        </ul>
    </div>
</div>

поместит пунктирную красную рамку ТОЛЬКО вокруг двух внутренних блоков.

Другими словами, вместо того, чтобы пытаться заставить RTE-редактор динамически назначать класс (требующий программирования, слишком специфичного для широкого использования), вы можете просто нацеливаться на элементы более конкретно, используя CSS.

проверьте: http://www.w3schools.com/cssref/css_selectors.asp

вы можете использовать jQuery аналогичным образом: например, jQuery('.parent > div').html()

РЕДАКТИРОВАТЬ после того, как увидели редактирование вашего сообщения

ul.my-custom-class {
    /* definitions for the ul */
}
ul.my-custom-class > li {
    /* definitions for only the directly descended lis */
}

<ul class="my-custom-class">
   <li>Item 1</li>
       <ul>
           <li>will NOT be affected</li>
           <li>will NOT be affected</li>
       </ul>
   <li>Item 2</li>
   <li>Item 3</li>
</ul>

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

person aequalsb    schedule 18.05.2015
comment
Просто с помощью css это был бы самый простой способ. Но я подумал, что могу использовать стили RTE-блоков для реализации типичной начальной загрузки List-Group-Feature. - person Inceddy; 18.05.2015
comment
правильно, но для автоматического добавления класса ко всем прямым дочерним элементам потребовалось бы много программирования, которое, как я полагаю, не использовалось бы многими людьми. он также требует от RTE немного чтения мыслей или, по крайней мере, требует сложного интерфейса для настройки RTE для автоматического назначения классов — и насколько хорошо он справится с этим, когда многие из них не могут справиться с более простыми вещами? а как насчет удаления этих классов? К сожалению, я думаю, что то, о чем вы спрашиваете, - это мечта, которой суждено стать кошмаром... - person aequalsb; 18.05.2015
comment
Что ж, тогда было бы лучше определить два разных стиля блоков, один для ul-, а другой для li-элементов. - person Inceddy; 18.05.2015
comment
все, что я гуглил для адресов Typo RTE, добавляющих несколько классов к одному и тому же элементу, но не добавляющих автоматически классы к дочерним элементам. опять же, я предпочитаю использовать CSS, чтобы получить именно то, что мне нужно. это уменьшает полученный HTML-код и упрощает чтение для меня. - person aequalsb; 18.05.2015