Question

所以我正在做的是从Mysql数据库中提取电池电压和电池状态，处理data.php中的数据并将其放入Json数组中。当我到达Javascript端时，我被卡住了。

2个问题：问题1：如何在不删除跨度的情况下将值插入到html的id电压中？

HTML代码：

        <div id="voltState" class="tile-box bg-green">
            <div class="tile-header">
                Battery Status
                <div class="float-right">
                    <i class="glyph-icon icon-bolt"></i>
                    Green
                </div>
            </div>
            <div class="tile-content-wrapper">
                <i class="glyph-icon icon-database"></i>
                <div id="voltage" class="tile-content">
                    <span>volts</span>
                </div>
            </div>
        </div>

问题2：class =＆＃34; tile-box bg-green＆＃34;＆gt;我想用Javascript替换var状态，所以它看起来像class =＆＃34; tile-box bg-（status var here）＆＃34;＆gt;

    $(document).ready(function() {
        sensorData();
    });

    function sensorData(){
        $.ajax({
            type:'GET',
            url:"data.php",
            data:"json",
            success:function(sensor) {
                //document.write(sensor);
                var volt = sensor[0];
                var status = sensor[1];
                var date = sensor[2];

                document.getElementById('voltage').innerHTML = (volt);
                $("#voltState").toggleClass('bg-green bg-(STATUS VAR HERE??)');
            },
        dataType:'json' 
        });
    }
    setInterval(sensorData, 3000);

Answer 1

如果您想要在值之前或之后的范围，可以使用$("#voltage").append(volt)或$("#voltage").prepend(volt)。在这种情况下，我假设你想要伏特后的跨度，所以你可以使用第二个代码。如果您想要新范围内的值，您还可以使用：

$（＆＃34;＃电压＆＃34）。在前面加上（$（＆＃34;＆＃34;）文本（伏特））;

您可以将以前的状态值存储在变量中，例如 pastStatus 。所以一旦你设置了

$("#voltState").removeClass('bg-'+pastStatus).addClass('bg-'+status); pastStatus = status

注意：如果要在添加和删除同一个类之间切换，则使用 toggleClass。在这种情况下无法使用它，因为您要添加一个类并删除另一个类。

Answer 2

document.getElementById('voltage').appendChild(volt);

或

document.getElementById('voltage').innerHTML = '<span>'+volt+'</span>';

Jquery类和InnerHtml

2 个答案: