使用javascript查找和替換HTML文本

使用所見即所得類型的網頁創建器，鏈接到各種數據庫以從客戶端服務器獲取信息。使用javascript查找和替換HTML文本

一個變量用於頻率，並有三個可能的輸出，MO，YR或它是空白的。

這是我的一個地方HTML（這可以出現多次，只是交換了1對下一個號碼）

<span style="font-size:24px;"><strong>[email protected]@1_Price</strong></span><span style="font-size:18px;" class="rateFrequency">@@1_rateFrequency</span>

我期待使用JavaScript來更換MO或YR與/月和/年，填空時無所作爲。

沒有太多的JavaScript知識，所以不知道從哪裏開始。沿着這一行想財產以後，但不知道如果我在正確的方向我去或從這裏到

<script> 
 
    window.onload=function change() { 
 
     var frequency = document.getElementsByClassName("rateFrequency"); 
 
     if (condition1) { 
 
      block of code to be executed if condition1 is true 
 
     } else if (condition2) { 
 
      block of code to be executed if the condition1 is false and condition2 is true 
 
     } else { 
 
      block of code to be executed if the condition1 is false and condition2 is false 
 
     } 
 
    } 
 
change(); 
 
</script>

任何向前移動，以幫助我前進將是巨大的。謝謝！

來源

2016-06-08 JSturgessMeyers

假設我已正確理解您的要求，無論HTML文檔中有多少「rateFrequency」跨度，下面的代碼都應該這樣做。

window.onload = function(e) { 

    function changeFreq() { 
    var els = document.getElementsByClassName("rateFrequency"), 
    len = els.length; 
    while (len--){ 
     els.item(len).innerText = els.item(len).innerText.replace('MO', '/month').replace('YR', '/year'); 
    } 
    } 

    changeFreq(); 
};

否if在這裏是必需的。如果範圍中包含的文本是'MO'，則第一個replace將以'/ month'替換，第二個替換不會執行任何操作。如果範圍中包含的文本是'YR'，則第一個replace將不會執行任何操作，第二個replace將以'/ year'取代。如果跨度中的文本不是'MO'或'YR'，那麼replace都不會執行任何操作，並且跨度中的文本保持不變。

來源

2016-06-08 17:00:26 Tex

我認爲他具有未知的跨度。所以解決方案很好，但你必須循環。 –

謝謝，你是對的。當我第一次閱讀時，我錯過了這個問題。現在將調整代碼。 – Tex

還有什麼我需要得到這個功能？我嘗試將它粘貼到我的腳本部分，因爲沒有運氣，並且我還用window.onload將其插入並且沒有運氣。編輯：nevermind，將它添加到頁面的底部而不是頂部，現在正在工作。萬分感謝！ – JSturgessMeyers

-1

我已經爲你做了codepen看看。它使用jQuery，我建議你使用它，因爲它太棒了！

讓我知道，如果你有問題： Example

$(document).ready(function(){ 
$.each($('.rateFrequency'),function(){ 
    frq = $(this).text(); 
    if (frq=='MO'){ 
    console.log('REPLACE MONTH'); 
    $(this).text('/month'); 
    }else if(frq=='YR'){ 
    console.log('REPLACE YEAR'); 
     $(this).text('/year'); 
    } 
    }) 
})

來源

2016-06-08 17:01:12

Downvote reason：原始問題要求在JavaScript中提供解決方案，並且您提供了一個依賴於jQuery的解決方案。 – Tex

夠公平的。我這樣做是因爲他說他對javascript很新，所以我認爲向他展示那裏有什麼是可以的。我接受downvote。（也感謝您指定原因）。 –

我很欣賞jquery的迴應，如果我沒有使用所見即所得的平臺，我會全力以赴的。但在這個工作環境中直接添加javascript會更容易。 – JSturgessMeyers

使用javascript查找和替換HTML文本

回答

相關問題