以下是我用来注入需要应用于具有这两种样式组合的 Div 的样式:.noindex 和 .ms-wpContentDivSpace
<script>
$(document).ready(function(){
$('.noindex, .ms-wpContentDivSpace')..css({
overflow: auto,
height : '150px'
});
});
</script>
<style>
.autoScrolListViewWP
{
HEIGHT: 150px;
OVERFLOW: auto
}
</style>
<script>
$(document).ready
(
function()
{
$('.noindex, .ms-wpContentDivSpace').addClass('autoScrolListViewWP');
}
);
</script>
好吧,但我需要的是上面新的CSS autoScrolListViewWP应该只添加到那些css组合仅适用于这两个类.noindex和.ms-wpContentDivSpace的元素中。
但是上面的脚本会将样式应用于存在这两个类的 css 的任何组合。 例如.ms-WPBody , .noindex和ms-wpContentDivSpace autoScrolListViewWP
我的问题是我如何仅识别CSS类的spcific组合?
一个解决方案是获取这两个类的所有元素,然后遍历它们并查看它们是否有其他类。即:
$('.noindex.ms-wpContentDivSpace').each(function(i, elem) {
var classes = elem.className.split(/s+/);
if (classes.length === 2) { // they should have only these two classes
$(elem).addClass('autoScrolListViewWP');
// alternatively elem.className += ' autoScrolListViewWP'; (untested)
}
});
编辑我以前的代码:
$("[class*='.noindex .ms-wpContentDivSpace']").addClass('autoScrolListViewWP');
这应该有效。
编辑:它有效,请参阅示例:JsFiddle
试试
$('.noindex.ms-wpContentDivSpace').addClass('autoScrolListViewWP');
这是具有两个类的元素的标准 CSS 触发器
只是拿出空间。
$('.noindex.ms-wpContentDivSpace').addClass('autoScrolListViewWP');
这将仅将类添加到同时具有类 noindex
和 ms-ContentDivSpace
的元素中。
是的,jQuery非常聪明。这就像使用 CSS 一样。
编辑:
我没有意识到您想选择元素,如果它有这两个类但没有其他类。这有点棘手。
如果您知道不想包含哪个类,那么这是最简单(也是最快)的方法:
$('.noindex.ms-wpContentDivSpace').not('.theClassYouDontWant').addClass('autoScrolListViewWP');
在你的 jQuery 调用中,
$('.noindex, .ms-wpContentDivSpace')..css({
表示 .noindex 和 .ms-wpContentDivSpace 中的每一个
$('.noindex.ms-wpContentDivSpace')..css({
表示 .noindex 和 .ms-wpContentDivSpace