用jquery为div设置数据答案

【问题标题】：set data for div with jquery用jquery为div设置数据
【发布时间】：2017-07-17 05:53:18
【问题描述】：

我有一个显示计数器编号的 div，当此 div 的数据为静态时，一切都很好，但是，我想使用 Jquery 或 ajax 请求设置数据。我测试了这段代码，但没有工作

HTML 代码

<div id="NewVistors" class="number count-to" data-from="" data-to="" data-speed="" data-fresh-interval="20"></div>

jQuery 代码：

<script>
    window.onload=function(){

        var div = $('#NewVistors');
        div.data('data-from',0);
        div.data('data-to',20000);
        div.data('data-speed',1000);
        div.data('data-fresh-interval',20);
        console.log(div.data('data-to'));           
        }

</script>

当我在控制台中运行此代码时，我可以获得 data-to 属性，即 20000

【问题讨论】：

看看这个解决方案stackoverflow.com/a/11794180/4687602

标签： jquery html

【解决方案1】：

这里有解决方案https://jsfiddle.net/5mwdcugq/

var div = $('#NewVistors');
div.attr('data-from',0);
div.attr('data-to',20000);
div.attr('data-speed',1000);
div.attr('data-fresh-interval',20);
console.log(div.attr('data-to'));

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="NewVistors" class="number count-to" data-from="" data-to="" data-speed="" data-fresh-interval="20"></div>

这里还有一个解决方案https://jsfiddle.net/5mwdcugq/1/

var div = $('#NewVistors');
div.data('from',0);
div.data('to',20000);
div.data('speed',1000);
div.data('fresh-interval',20);
console.log(div.data('to'));

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="NewVistors" class="number count-to" data-from="" data-to="" data-speed="" data-fresh-interval="20"></div>

【讨论】：

【解决方案2】：

.data() 使用内部缓存，它只使用数据属性作为默认值。通过.data(key, value) 执行更新操作时，DOM 未更新。另外用法也不对，使用方法时不需要前缀data-。

div.data('from',0);

我认为你需要使用 .attr() 来获取和设置属性值。

var div = $('#NewVistors');
div.attr('data-from',0);

【讨论】：

【解决方案3】：

您可以使用两种不同的方法设置data

第一种方法

window.onload=function(){
    var div = $('#NewVistors');
    div.data('from',0);
    div.data('to',20000);
    div.data('speed',1000);
    div.data('fresh-interval',20);
    console.log(div.data('to'));           
}

第二种方法

window.onload=function(){
    var div = $('#NewVistors');
    div.attr('data-from',0);
    div.attr('data-to',20000);
    div.attr('data-speed',1000);
    div.attr('data-fresh-interval',20);
    console.log(div.attr('data-to'));           
}

【讨论】：

【解决方案4】：

请将此代码添加到您的函数中。

$("#NewVistors").html(div.data('data-to'));

【讨论】：