如何根據文本添加額外的屬性

這是我的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

如何根據文本添加額外的屬性

回答

相關問題