JavaScriptによって生成されたテキストボックスのセットがあります。これらのテキスト ボックスの一部には、追加の CSS スタイルが必要です。一部のテキストボックスのみがこのスタイリングを必要とするため、id プロパティを使用できません。すべてのテキストボックスで同じであるため、クラスプロパティも使用できません。
私は現在、次のような CSS を使用しています。
#txtSys8
{
position: relative;
left: 203px;
}
#txtSys9
{
position: relative;
left: 203px;
}
#txtSys10
{
position: relative;
left: 203px;
}
スタイルを個別に設定せずにこれらの ID (#txtSysy8 から #txtSys19 まで) をループできる方法はありますか?
これはhtmlを生成するコードです
rssTag ="<TABLE id='rssTable' border=\"0\" width=\"100%\"><TBODY>";
for(var i=8; i<arrGridData.length; i++){
var upToNCharacters = arrGridData[i][0].substring(0, 13);
if(upToNCharacters == "RSS_FEED_LINK"){
rssTag+="<TR><TD><font>" + arrGridData[i][1] + ":</TD><TD> <input type=\"text\" id=\"txtSys"+i+"\" name=\"txtSys"+i+"\" onChange=\"pgEdited()\" tabindex=\" " +(i+1) +"\" class=\"fontDefault\"></TD><TD><input type=\"checkbox\" id=\"check" + arrGridData[i][0].substring(14, arrGridData[i][0].toString().length) + "\" name=\"check\" onChange=\"pgEdited()\" class=\"chk\"/></TD></TR>";
}else{
rssTag+="<TR><TD><font>" + arrGridData[i][1] + ":</TD><TD><input type=\"text\" id=\"txtSys"+i+"\" name=\"txtSys"+i+"\" onChange=\"pgEdited()\" tabindex=\" " +(i+1) +"\" class=\"fontDefault\"></TD></TR>";
}
createArrControls(i);
rssTag += "</TBODY></TABLE>";
document.getElementById('tableDiv2').innerHTML=rssTag;
JavaScript 配列をチェックしています。配列が「RSS_FEED_LINK」の文字列を保持している場合、文字列「rssTag」にテキストボックスとチェックボックスが追加されます。それ以外の場合は、テキスト ボックスのみが追加されます。
これらの生成されたテキストボックスにスタイルを追加する必要があります