拆分字母和分配類

我遇到以下問題，我需要分隔一個範圍中的每個字符並根據具有javascript的字符分配一個類。拆分字母和分配類

我有這樣的：

<div>1111222</div>

，最終的結果應該是這樣的：

<div> 
    <span class="e1">1</class> 
    <span class="e1">1</class> 
    <span class="e1">1</class> 
    <span class="e1">1</class> 
    <span class="e2">2</class> 
    <span class="e2">2</class> 
    <span class="e2">2</class> 
</div>

這是我使用的代碼：

var str = $('.test').text(); 
var result = ""; 
str = str.split(""); 
var h = $(this).text(); 
$.each(str,function(){ 
if(h = 1) 
{ 
    result += '<span class="e1">' + this + '</span>'; 
} 
else if (h = 2) 
{ 
    result += '<span class="e2">' + this + '</span>'; 
} 
}); 
$('.test').html($(result));

感謝

來源

2014-10-17 Luis Moran

如何分配一個類取決於實際的字符？如果它是1，那麼class =「e1」例如 – 2014-10-17 02:05:22

您可能從有效標記開始，大概''應該是''。 – RobG 2014-10-17 03:12:58

var spanVals = $('div').text().split(''); 
for(var i = 0; i < spanVals.length; i++) { 
    var span = $('<span>').addClass('e'+spanVals[i]).text(spanVals[i]); 
    $('div').append(span); 
}

來源

2014-10-17 02:02:03 Brennan

如果我想爲所有1添加一個類並且向2添加一個不同的類，該怎麼辦？ – 2014-10-17 02:07:21

這也是：'addClass（'e'+ spanVals [i]）' – Brennan 2014-10-17 02:17:33

假設你有到div的引用，那麼下面應該做的工作：

var div = document.getElementById('d0'); // id of div 

// Get the text 
var text = div.textContent; 

// Clear the div content 
div.innerHTML = ''; 

// Insert spans around characters 
text.split('').forEach(function(c){ 
    var node = document.createElement('span').appendChild(document.createTextNode(c)).parentNode; 
    node.className = 'e' + c; 
    div.appendChild(node); 
});

您將需要一個polyfill爲的forEach舊的瀏覽器如IE 8

來源

2014-10-17 03:18:28 RobG

拆分字母和分配類

回答

相關問題