如何根据文本添加额外的属性

这是我的HTML代码如何根据文本添加额外的属性

<div id="ccc_new_val_hdn"> 
    <span>9</span> 
    <span>,</span> 
    <span> </span> 
    <span>6</span> 
    <span>2</span> 
    <span>1</span> 
</div>

我需要逗号和空格转换这样

<span class='comma'>,</span>

和空间

<span class='space'> </span>

我试过：contains（）和find（），但我无法获得代码。

来源

2012-01-16 Mifas

只需迭代并设置类。

$('#ccc_new_val_hdn span').each(function() { 
    if($(this).html() == ','){ 
     $(this).addClass('comma'); 
    } 
    if($(this).html() == ' '){ 
     $(this).addClass('space'); 
    } 
});

演示：http://jsbin.com/igaraq

来源

2012-01-16 06:06:26

你可以只选择div里面所有的跨度和修剪，然后检查值，之后只需将要应用的类。

$(document).ready(function(){ 
    $('#ccc_new_val_hdn span').each(function(){ 
     var text = $.trim($(this).text()); 
     if(text === ',') 
      $(this).addClass('comma') 
     else if(text === "") 
      $(this).addClass('space'); 
    }); 
});

来源

2012-01-16 06:17:58 hnp

或者.text()就够

$('#ccc_new_val_hdn span').each(function() { 
    if($(this).text() == ','){ 
     $(this).addClass('comma'); 
    } 
    if($(this).text() == ' '){ 
     $(this).addClass('space'); 
    } 
});

来源

2012-01-16 06:19:49 ianace

浏览器会有不同的表现，当你有一个包含一个空白字符的元素。例如，Safari只是在解析时删除它，而Firefox保留它。

jQuery的:contains过滤器可能不是非常有用，因为它在元素的文本内容的任何位置进行搜索，但它看起来像要进行精确搜索。与:contains的问题是，只是一个逗号寻找一个元素时，它会匹配所有这些：

<span>,</span> 
<span>hello, world</span> 
<span> , </span>

的第二和第三元素将同时匹配一个逗号和空格。

下面是一个类似于:contains的自定义jQuery过滤器，但是会进行精确的文本匹配。

jQuery.expr[':'].hasText = function(element, index, meta) { 
    var textToSearch = meta[3]; 
    return $(element).text() == textToSearch; 
};

将其作为:hasTexT(..)使用。以下是如何通过文本内容选择元素并更改其CSS类的示例。

$(':hasText(,)').addClass('comma'); 
$(':hasText()').addClass('space');

这是example。在Firefox中试用。其他浏览器可能吃掉单个空白。

来源

2012-01-16 06:39:54 Anurag

如何根据文本添加额外的属性

回答

相关问题