时间戳

首页 > 解决方案 > 如何使用 json 脚本显示国家标志？

javascript - 如何使用 json 脚本显示国家标志？

问题描述

我有一个标志文件夹（例如）：

gb.png

us.png

我有一个 JSON 文件（countries.json）：

{
  "GB": "United Kingdom",
  "US": "United States"
}

我有一张桌子：

<table>
           <tr>
              <td style="font-family: robotobold; color: white"><b>United Kingdom</b></td>
              <td style="font-family: robotoblack;text-align:right; font-size:10px; color: #aeafaf;">{data1}</td>
              <td  style="font-family: robotoregular;text-align:left; color: #46e08b;"><b>{data2}</b></td>
              <td style="font-family: robotoblack;text-align:right; font-size:10px; color: #aeafaf;">{data3}</td>
              <td style="font-family: robotoregular;text-align:left; color: #F65164"><b>{data4}</b></td>
            </tr>

我想在单词前的第 1 列中添加任何国家/地区的图标。

我不知道从哪里开始或在这里做什么 - 有人有什么想法吗？

编辑：我试过这样做：

window.onload = function(){
    var table = document.getElementById("datatable");
    for (var i = 0, row; row = table.rows[i]; i++) {
        for (var j = 0, col; col = row.cells[j]; j += 4) {
            document.getElementsByTagName("img").src = "us.png"
        }  
    }
}

这是试图将所有元素设置为具有美国国旗。

我还添加<img src="">了<td>每个<tr>.

但是，什么也没有发生 - us 标志没有出现。

标签： javascripthtmlcssjsonhtml-table

解决方案

是的，您可以使用 Javascript 获取 html 元素的文本内容：例如使用 jQuery

var content = $('.myvalue').text();

或者，如果您使用循环，则为多个值：

var i = 0;
while(i < $('.myvalues').length){
    var current_val = $('.myvalues').eq(i);
    //Do something with current_val
    i++;
}

然后与Json文件进行比较，最好再次转换为数组，以便您轻松循环。因此，如果您使用与obj_assoc我之前的答案中所述相同的内容，则可以进行比较，因为它是一个值数组

推荐阅读