Javascript Arraysを使用してHTMLテーブルを作成しますか？

私はラボ割り当てを受けました。次のように質問がある：私はちょうど得られた出力を表示するようにするdocument.write（）関数を使用Javascript Arraysを使用してHTMLテーブルを作成しますか？

<!DOCTYPE html> 
<html> 
<head> 
<title> Manan Tyagi 16BCE1240</title> 

<p style="text-align:center;color:purple;font-size:30px" >Coordinates Of State Capitals</p> 
<p id="demo"></p> 

<script> 
var capital=["Montgomery","Juneau","Phoenix","Little Rock","Sacramento","Denver","Hartford","Dover","Tallahassee","Atlanta"]; 
var state=["Alabama","Alaska","Arizona","Arkansas","California","Colorado","Connecticut","Delaware","Florida","Georgia"]; 
var code=["AL","AK","AZ","AR","CA","CO","CT","DE","FL","GA"]; 
var latitude=[32,58,33,35,38,40,42,39,31,34]; 
var longitude=[-86,-134,-113,-92,-121,-105,-73,-76,-84,-84]; 
var htmlstr="<tbody>"; 
for(var i=0;i<10;++i) 
{ 
    htmlstr+="<tr>"+"<td>"+capital[i]+"</td>"+"<td>"+state[i]+"</td>"+"<td>"+code[i]+"</td>"+"<td>"+latitude[i]+"</td>"+"<td>"+longitude[i]+"</td>"+"</tr>"+"<br>"; 
} 
htmlstr+="</tbody>"; 
document.write(htmlstr); 
</script> 

</body> 
</head> 
</html>

： Create Table Using JS Arrays

私は、次のコードを思い付きました。私は写真のようにテーブルを作りたいですか？コードが正しく実行されるためにどこで何を変更すればよいですか？

ありがとうございます。

[編集]私はソート部分について心配です。特定の列のみに従ってテーブルをソートするにはどうすればよいですか？

出典

2017-08-14 Manan Tyagi

を参照してくださいどのようなあなたのコードから出力され、そしてどのようにそれがラボの質問に違うのですか？書式（表の色や罫線）、ソートや平均化の部分について質問していますか？ – Neil

ニール私はテーブルをフォーマットすることができますが、それは問題ではありません。私はソート部分について心配しています。特定の列のみに従ってテーブルをソートするにはどうすればよいですか？ –

5つの独立した配列（つまり、緯度配列を並べ替えると大文字の配列をソートしない）があるので、データの並べ替えが間違っていると思います。あなたが使用できるデータ構造があるので、行のすべての項目は同じ配列要素の一部です。（私は、あなたに答えを直接与えるのではなく、正しい答えにあなたを促そうとしています）。 – Neil

<table>タグが含まれていませんでした。 http://html.com/tables/

<!DOCTYPE html> 
 
<html> 
 

 
<head> 
 
    <title> Manan Tyagi 16BCE1240</title> 
 

 
    <p style="text-align:center;color:purple;font-size:30px">Coordinates Of State Capitals</p> 
 
    <p id="demo"></p> 
 

 
    <script> 
 
    var capital = ["Montgomery", "Juneau", "Phoenix", "Little Rock", "Sacramento", "Denver", "Hartford", "Dover", "Tallahassee", "Atlanta"]; 
 
    var state = ["Alabama", "Alaska", "Arizona", "Arkansas", "California", "Colorado", "Connecticut", "Delaware", "Florida", "Georgia"]; 
 
    var code = ["AL", "AK", "AZ", "AR", "CA", "CO", "CT", "DE", "FL", "GA"]; 
 
    var latitude = [32, 58, 33, 35, 38, 40, 42, 39, 31, 34]; 
 
    var longitude = [-86, -134, -113, -92, -121, -105, -73, -76, -84, -84]; 
 
    var htmlstr = "<table><tbody>"; 
 
    for (var i = 0; i < 10; ++i) { 
 
     htmlstr += "<tr>" + "<td>" + capital[i] + "</td>" + "<td>" + state[i] + "</td>" + "<td>" + code[i] + "</td>" + "<td>" + latitude[i] + "</td>" + "<td>" + longitude[i] + "</td></tr>"; 
 
    } 
 
    htmlstr += "</tbody></table>"; 
 
    document.write(htmlstr); 
 
    </script> 
 
</head> 
 

 
<body> 
 
</body> 
 

 

 
</html>

出典

2017-08-14 09:06:41 Sankar

Javascript Arraysを使用してHTMLテーブルを作成しますか？

答えて

関連する問題