如何在JavaScript中为for循环中的特定img元素添加类

此代码没有任何错误。而且，我想为for循环中的所有img元素添加一个类“sprite”。另外，如果eachName [1]是a.png或b.png，我想向它们添加一个“found”类，否则我想添加一个“unfound”类。我如何编写代码来实现它们？谢谢。如何在JavaScript中为for循环中的特定img元素添加类

function populatePokedex() { 

    var xhr = new XMLHttpRequest(); 
    xhr.open("GET", "data.txt"); 
    xhr.onload = function(){ 
     if (this.status == 200) { 

      var picArr = this.responseText.split("\n"); 
      for(var i=0; i < picArr.length; i++){ 
       var eachName = picArr[i].split(":") 
       var spriteurl = "/Pokedex/sprites/" + eachName[1]; 
       document.getElementById("pokedex-view").innerHTML += "<img src=" + spriteurl + ">"; 
      } 

     } else { 
      document.getElementById("pokedex-view").innerHTML = "ERROR: Status: " + this.status + ", " + this.statusText; 
     } 
    } 
    xhr.onerror = function(){ 
     document.getElementById("pokedex-view").innerHTML = "ERROR"; 
    } 
    xhr.send(); 
}

来源

2017-05-07 Tak

... 
    xhr.onload = function(){ 
     if (this.status == 200) { 

      var picArr = this.responseText.split("\n"); 
      for(var i=0; i < picArr.length; i++){ 
       var eachName = picArr[i].split(":") 
       var spriteurl = "/Pokedex/sprites/" + eachName[1]; 
       var imgClass = 'sprite'; 
       if (eachName[1] === 'a.png' || eachName[1] === 'b.png') { 
        imgClass += ' found'; 
       } else { 
        imgClass += ' unfound '; 
       } 
       document.getElementById("pokedex-view").innerHTML += '<img src="' + spriteurl + '" class="' + imgClass + '">'; 
      } 

     } else { 
      document.getElementById("pokedex-view").innerHTML = "ERROR: Status: " + this.status + ", " + this.statusText; 
     } 
    } 
...

来源

2017-05-07 07:29:18 styopdev

太谢谢你了。我可以给他们全部添加一个类“精灵”。但一个“未完成”的课程运作不佳。这是我想要做的。但我工作不好。 - > if（eachName [1] ==“a.png”）{ imgClass + ='found'; } else { imgClass + ='unfound'; } – Tak

记录每个名称[1]以确保其格式符合要求。可能是它不是你想要的文件名（例如'/a.png'或'images/a.png'） – styopdev

我无法解决...我会再提出一个关于此代码的问题.. – Tak

如果代码其余部分的工作，增加以下线将解决您的问题。

用法

... 
var spriteurl = "/Pokedex/sprites/" + eachName[1]; 
img = document.createElement("img"); 
img.setAttribute("src", spriteurl); 
klass = ["a.png", "b.png"].some(function(e) { return e == eachName[1]; } ? "found" : "unfound"; 
img.setAtrribute("class", klass) // or classList += 
document.getElementById("pokedex-view").appendChild(img); 
...

Array#some

Ternary operator

来源

2017-05-07 07:47:20 marmeladze

如何在JavaScript中为for循环中的特定img元素添加类

回答

相关问题