查找某些詞和替換他們

Question

我想找到：

「紐約」，並以「紐約市」
「華盛頓」代替，並用「更換西雅圖 「
」 佛羅里達 「取而代之的是」 傑克遜 「
」 南卡羅來納州「取而代之的是」 哥倫比亞「
」 West_Virginia「取而代之的是」 查爾斯頓「

我做下面的下面的示例代碼，但似乎沒有不工作：

演示：http://jsfiddle.net/N3ZmS/

<td id="dont-replace-them"> 
New York<br /> 
Washington<br /> 
Florida<br /> 
South-Carolina<br /> 
West_Virginia<br /> 
</td> 

<br /> 

<td id="replace-them"> 
New York<br /> 
Washington<br /> 
Florida<br /> 
South-Carolina<br /> 
West_Virginia<br /> 
</td> 

<script type="text/javascript"> 
function replaceWords() { 
    document.getElementById("replace-them").innerHTML.replace("New York", "New York City"); 
    document.getElementById("replace-them").innerHTML.replace("Washington", "Seattle"); 
    document.getElementById("replace-them").innerHTML.replace("Florida", "Jacksonville"); 
    document.getElementById("replace-them").innerHTML.replace("South-Carolina", "Columbia"); 
    document.getElementById("replace-them").innerHTML.replace("West_Virginia", "Charleston"); 
}; 
</script> 

任何人都知道應該修復什麼才能使其工作？

Answer 1

.replace();返回字符串替換，它不會改變DOM中的字符串。

var str = 'foobar'; 
str.replace('foobar', 'lorem ipsum'); // Returns 'lorem ipsum', but does no DOM manipulation. 

你需要每個.replace()的結果保存到一個臨時變量，然後事後更新DOM。

function replaceWords(el) { 
    el.innerHTML = el.innerHTML 
        .replace('New York', 'New York City') 
        .replace('Washington', 'Seattle') 
        .replace('Florida', 'Jacksonville') 
        .replace('South-Carolina', 'Columbia') 
        .replace('West_Virginia', 'Charleston'); 
} 

replaceWords(document.getElementById('replace-them')); 

Answer 2

您需要將新的字符串值應用到DOM元素

document.getElementById("replace-them").innerHTML = 
    document.getElementById("replace-them").innerHTML.replace("New York", "New York City"); 
// etc. 

順便說一下，定義函數replaceWords()你還需要確保你真正把它之後。

您還需要使用div或類似元素的標記正確呈現。

工作fiddle here。