如何使用 Javascript 将元素的内部 HTML 文本替换为数组的一部分

Question

我正在做一个 JavaScript class 作为练习，我们必须将一个数组与另一个数组进行比较，并将一个元素的内部 html 文本仅替换为两个数组中都存在的字符串值。这是 javascript：

// Here is an array of US State Capitals to use
var capitals = ["Montgomery", "Juneau", "Phoenix", "Little Rock", "Sacramento", "Denver", "Hartford", "Dover", "Tallahassee", "Atlanta", "Honolulu", "Boise", "Springfield", "Indianapolis", "Des Moines", "Topeka", "Frankfort", "Baton Rouge", "Augusta", "Annapolis", "Boston", "Lansing", "Saint Paul", "Jackson", "Jefferson City", "Helena", "Lincoln", "Carson City", "Concord", "Trenton", "Santa Fe", "Albany", "Raleigh", "Bismarck", "Columbus", "Oklahoma City", "Salem", "Harrisburg", "Providence", "Columbia", "Pierre", "Nashville", "Austin", "Salt Lake City", "Montpelier", "Richmond", "Olympia", "Charleston", "Madison", "Cheyenne"];



// Using JavaScript, get the contents of the "cities" div and convert it into an array of strings (each city will be an element in the array)
var citiesString = document.getElementById("cities").innerHTML;

var cities = citiesString.split(", ");


// Loop through the array of cities.  Compare each element to the array of capitals.  If a city is NOT a state capital, update the HTML output to leave out that city.  (Note: formatting, commas, etc. doesn't count -- just get the cities to display.)


for (i = 0; i < cities.length; i++) {
  if(capitals.indexOf(cities[i]) >=0) {
    document.getElementById("cities").innerHTML += cities[i] += ", ";
  } 
}

我让它只显示两个数组中存在的城市，但它仍然显示之前的城市数组的整个列表。如何让它只显示 "Boston, Indianapolis, and Atlanta"?

Answer 1

清除for循环前'cities'的内容

document.getElementById("cities").innerHTML = "";

您是将数组附加到元素中的现有文本。

如何使用 Javascript 将元素的内部 HTML 文本替换为数组的一部分

How to replace inner HTML text of an element with part of an array using Javascript

javascript

arrays

for-loop

if-statement

innerhtml