当将定义的块样式添加到父元素时,是否可以告诉RTE解析器修改所有直接子元素的class-attribute?
如果RTE内容是这样的
<ul>
<li>Item 1</li>
<li>Item 2</li>
<li>Item 3</li>
</ul>
我通过TS中定义的blockstyle将“my-custom-class”添加到ul
- 元素。
<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>
尽管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');
答案 0 :(得分:0)
你能用这个吗?
.parent > children
将仅定位直接后代(特别是div 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>
只会在两个内部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的特定目标功能