使用jquery在文本字符串之間打包一些html標籤

span中的這個文本是由php生成的，如果我要將標籤從每年添加到文本結尾。我不知道如何定位文本字符串來啓動jQuery。這裏使用jquery在文本字符串之間打包一些html標籤

<!-- input: --> 
<span class="price">RM1,088.00 Annually + RM10.00 Setup Fee (Free Domain)</span> 

<!-- output: --> 
<span class="price"> 
    RM1,088.00 
    <small>Annually + RM10.00 Setup Fee (Free Domain)</small> 
</span>

來源

2017-03-17 Zi Gang

通過'我不知道如何定位文本字符串來啓動jquery.'你的意思是'RM1,088.00'文本？你的問題有點不清楚，但也許我不明白。你想達到什麼目標？你有什麼試驗？ – Ionut

@lonut Rory McCrossan已經幫我編輯帖子..非常感謝..你指的是我的輸出..這就是我想要的.. –

最好的解決辦法是修改你的PHP代碼生成的輸出。

如果這是不可能的，那麼假設價格的格式在生成的字符串中始終是相同的，那麼您可以將空格分割爲空格來創建數組並將其分開。試試這個：

$('.price').html(function() { 
 
    var values = $(this).text().trim().split(' '); 
 
    return values.shift() + '<small>' + values.join(' ') + '</small>'; 
 
});

span small { 
 
    display: block; 
 
    color: red; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<span class="price">RM1,088.00 Annually + RM10.00 Setup Fee (Free Domain)</span> 
 
<span class="price">RM2,090,082.00 Annually + RM25.00 Setup Fee (Free Domain)</span>

來源

2017-03-17 08:04:23

謝謝!!!乾淨的代碼 –

不客氣，很高興幫助 –

我想你可能想看看一個jQuery wrapInner。

$('.price').wrapInner('<small></small>');

這將包裝任何sup的文本鏈接。

http://api.jquery.com/wrapInner/

來源

2017-03-17 08:06:59

可以使用Text#splitText一分爲二文本節點，此時第二個可以很容易地使用jQuery包裹：

$('.price').contents().each(function() { 
 
    $(this.splitText(this.data.indexOf("Annually"))).wrap('<small>') 
 
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<!-- input: --> 
 
<span class="price">RM1,088.00 Annually + RM10.00 Setup Fee (Free Domain)</span>

來源

2017-03-17 08:07:38 gyre

我的代碼很容易理解。：D謝謝 –

很高興幫助！如果你覺得我的回答有助於解決你的問題，總是會接受接受:) – gyre

我想你想這...

$(function(){ 
 
    var text = $(".price").text(); 
 
    text = text.split("+"); 
 
    console.log(text[0] + text[1]); 
 
    
 
    $('.price').html(text[0] + "<small>" + text[1] + "</small>"); 
 
    
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<span class="price">RM1,088.00 Annually + RM10.00 Setup Fee (Free Domain)</span>

來源

2017-03-17 08:07:47 user7417866

你可以在第一空間伊斯利拆分，然後圍繞第二部分的小標籤附着，請參見下面請：

var firstPart = $(".price").text().substr(0,$(".price").text().indexOf(' ')); 
 
    var secondPart = $(".price").text().substr($(".price").text().indexOf(' ')+1); 
 
    var result = firstPart + "<small>" + secondPart + "</small>"; 
 
    $(".price").html(result);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<!-- input: --> 
 
<span class="price">RM1,088.00 Annually + RM10.00 Setup Fee (Free Domain)</span>

我希望它可以幫助你，再見。

來源

2017-03-17 08:20:30 Alessandro

使用jquery在文本字符串之間打包一些html標籤

回答

相關問題