2017-03-03 61 views
0

我想要做的是添加一個ID到我的動態信息。這條線嘗試分配ID爲循環功能

var webaddress = '<img id= "[index]" src="http://pokeapi.co/media/img/[index].png">'; 

如果我拿出id="[index]循環工作正常,給我的圖像。但我需要爲它們添加一個ID,以便我可以做其他的事情。如果有人能告訴我如何改變docuent.write(text)來寫入specfice div,所以我可以把我的腳本放在頁面頂部,獎勵幫助會很好。

<!DOCTYPE html> 
<html> 

<head> 
    <title></title> 
    <meta charset="utf-8"> 
    <link rel="stylesheet" type="text/css" href="style.css"> 
    </style> 
    <script type="text/javascript" rel="script" type="script" href="script.jss"></script> 
    <script type="text/javascript" src='http://code.jquery.com/jquery-1.10.2.min.js'></script> 
    <script type="text/javascript"> 
    $(document).ready(function() { 



    }); 
    </script> 
</head> 

<body> 
    <div id="wrapper"> 
    </div> 
    <div id="pokedeck"> 
     <div id="pokelist"> 
      <script type="text/javascript"> 
      var webaddress = '<img id= "[index]" src="http://pokeapi.co/media/img/[index].png">'; 
      var text = ""; 
      for (var i = 1; i <= 152; i++) { 
       text += webaddress.replace("[index]", i); 
      } 
      document.write(text); 
      </script> 
     </div> 
     <div id="deck1"></div> 
    </div> 
+0

在哪方式是這個代碼不工作?目前的產出是多少? – David

+0

它沒有分配id與id索引部分在前面的圖片不呈現。如果我拿出前面的索引,圖片渲染就不會給我這個ID。 –

+0

什麼是'152',你想添加152'img'標籤? – Sravan

回答

2

方括號是特殊字符,因此您需要將它們轉義出來。請參閱下面的代碼(我已添加註釋的話)

// the following goes in your document ready 
 

 
var webaddress = '<img id= "[index]" src="http://pokeapi.co/media/img/[index].png">'; 
 
var pokelist = $('#pokelist');    // get your pokelist 
 

 
for (var i = 1; i <= 152; i++) { 
 
    var image = webaddress.replace(/\[index\]/g, i); // escape your square brackets and make it a global replace - anything inside the// is replaced and the g means all occurences of 
 
    pokelist.append(image);       // append it to your div 
 
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="wrapper"> 
 
</div> 
 
<div id="pokedeck"> 
 
    <div id="pokelist"> 
 
    </div> 
 
    <div id="deck1"></div> 
 
</div>

我也會將你的腳本之前結束標記,而不是讓他們在頭