将文本从JavaScript转换为HTML

我试图从JSON文件parce中获取文本，并将该文本显示为HTML对象。但是我把它读成了一个字符串

我有一个JSON文件，如下所示：

JSON代码JSON/JSON_data.JSON：

{
    "counters": [
        {
            "variable": ":='webdata'.counter1:"
        },
        {
            "variable": ":='webdata'.counter2:"
        }
    ]
}

jQuery代码my_script.js:

$(document).ready(function(){
    $.ajaxSetup({ cache: false }); 
setInterval(function() {
    $.getJSON("json/json_data.json", function(result){
        $('#counter0').text(result.counters[0].variable);
    });
},1000);
});

$(document).ready(function(){
    $.ajaxSetup({ cache: false }); 
setInterval(function() {
    $.get("IOValue1.htm", function(result){
        $('#counter1').text((result));
    });
},1000);
});

HTML code index.htm：

<tr>
    <td>PT000</td>
    <td>Process value 0</td>
    <td> <label id="counter0">0</label> </td>
    <td>bar</td>
</tr>

<tr>
    <td>PT001</td>
    <td>Process value 1</td>
    <td> <label id="counter1">0</label> </td>
    <td>bar</td>
</tr>

jQuery代码my_script.js:

$(document).ready(function(){
    $.ajaxSetup({ cache: false }); 
setInterval(function() {
    $.getJSON("json/json_data.json", function(result){
        $('#counter0').text(result.counters[0].variable);
    });
},1000);
});

$(document).ready(function(){
    $.ajaxSetup({ cache: false }); 
setInterval(function() {
    $.get("IOValue1.htm", function(result){
        $('#counter1').text((result));
    });
},1000);
});

HTML code index.htm：

<tr>
    <td>PT000</td>
    <td>Process value 0</td>
    <td> <label id="counter0">0</label> </td>
    <td>bar</td>
</tr>

<tr>
    <td>PT001</td>
    <td>Process value 1</td>
    <td> <label id="counter1">0</label> </td>
    <td>bar</td>
</tr>

可能我没有考虑JavaScript是如何处理从JSON文件获得的字符串的。有人有想法吗？

改变

$('#counter0').text(result.counters[0].variable);

到

---

看看Knockout.JS，这是一个HTML数据绑定框架，我也强烈推荐使用Knockoutjs，就像@No1_Melman所说的那样。它很容易学习，并且有一个很好的文档。谢谢Hamed！即使结果是一样的。brouser显示存储在JSON文件中的文本，但不是HTML应该从该文本中解释的内容。