2015-10-14 49 views
3

我必须将jquery应用于由各种CMS生成的代码。我只是想添加一个类span标签有一定的font-family分配给他们。使用字体系列类型的目标特定元素

我遇到的问题是性能问题。此代码循环遍历生成的代码中的所有span标记,可能为数百个。是否有具有font-family'Open Sans'

的DEMO https://jsfiddle.net/w5fjqjvL/

// Works perfectly. Simple each loop iterating through ALL spans

$.each($('span'), function() { 
    if ($(this).css('font-family').indexOf("Open Sans") >= 0){ 
     $(this).addClass('openSans'); 
    } 
}); 
+1

'我有申请了jQuery由sorts'的CMS生成所以不是询问有关问题的代码,为什么你需要将代码添加到此特定元素,可能有更好的解决方法。并且'font-family'真的是使用内联样式属性添加的吗? –

+0

我的问题已被广泛简化。没有写传记,我的问题符合我的要求。是的,内联样式由CMS应用。这是使用CKEditor等工具时的常见做法。 – Peter

+0

如果您的CMS使用某种特定的方法添加内联样式,那么您可以改写此方法,这就是我所说的关于XY问题的意思。但是,恕我直言,你的问题是缺少更多的上下文,使其更清晰的具体样本。现在,如果最好的解决方法是添加类客户端,并且性能对您来说是一个问题,那么请不要使用jQuery,而应使用“纯”相关的js方法。只是好奇,但为什么你需要针对他们的'font-family'的特定跨度? –

回答

0

您可以使用过滤功能来获得与所需条件的所有元素只针对跨度的一种方式。然后将它们一起添加到它们中。不像在每种情况下单独添加元素。

但内部.filter()做相同的工作。迭代元素并根据条件返回过滤后的元素。当它增加课程的时候,唯一有效的方法就是它的一部分。

$('span').filter(function(){ 
    return $(this).css('font-family').indexOf("Open Sans") >= 0; 
}).addClass('openSans'); 
+0

与OP代码相比,这不会得到真正的优化 –

+0

@ A.Wolff:我已经指出了这一部分。将仅对类的添加逻辑有效。 –

+1

在这种情况下,使用'addClass()'方法的函数参数进行过滤部分 –

0

需要使用jQuery的过滤

检查文档here

var $addFonts = $('span').filter(function(e) { 
    return $(this).css('font-family').indexOf("Open Sans") >= 0); 
}); 

$addFonts.addClass('openSans'); 
相关问题