我的网站有CMS,因此用户可以直接插入文字和图片。 CMS ui允许浮动左/右图像,将内联样式应用于IMG标记。
<img src='...' style='float:left'>
我想检测IMG何时具有float:left/right
样式并将其替换为类,以便为其声明更多属性,如下例所示:
.floated-left
{
float:left;
margin-right:20px;
border-left:solid 5px red;
....
}
我想到了这样的事情:
if ( $("article").find('img').css('float') == 'left')
{
this.addClass('floated-left');
}
但似乎&#34; if条款&#34;永远不会是真的。 (我知道可能this.addClass()
也可能是错的,但alert()
目前都没有被解雇过。
你能帮助我吗?
答案 0 :(得分:4)
使用attr
代替css
来选择内嵌样式对象:
$('article img').each(function() {
if ( $(this).attr('style') == 'float:left') {
$(this).removeAttr('style').addClass('floated-left');
}
});
如果某些对象的风格不同,请尝试这种方式:
$('article img').each(function() {
if ( $(this).attr('style').indexOf('float:left') > -1 ) {
var targetedStyle = $(this).attr('style').replace('float:left','');
$(this).attr('style',targetedStyle).addClass('floated-left');
}
});
答案 1 :(得分:2)
为了应用更多声明,您可以通过纯CSS实现这一点:
img[style*="float:left"],
img[style*="float: left"] {
margin-right : 20px;
border-left : solid 5px red;
}
您可以使用CSS attribute selectors来选择有效的图片/元素。