前一陣，后臺用ifelse表達式直接返回html片段,由于傳值問題，我直接讓他把值放在data-上，我自己來取，由于自定義私有值的特性，很好的解決了傳值的問題。不過由于自己的粗心，導致測試當中，取值方式不當，發(fā)生取不到值的現(xiàn)象?，F(xiàn)在小結(jié)一下，避免以后出現(xiàn)同樣的錯誤。
首先列出data-屬性名的幾種情況：

<div data-username='zhd1' class='box box1'>data-username</div>
<div data-user-name='zhd2' class='box box2'>data-user-name</div>
<div data-userName='zhd3' class='box box3'>data-userName</div>
<div data-user-Name='zhd4' class='box box4'>data-user-Name</div>
<div data-Username='zhd5' class='box box5'>data-Username</div>
<div data-UserName='zhd6' class='box box6'>data-UserName</div>
<div data-USERNAME='zhd7' class='box box7'>data-USERNAME</div>

以上幾種data-屬性名的情況都是正確的。不過通過data()方法取值時屬性名情況就不一樣了?？聪旅妫?/p>

//原生js是通過DOM對象的dataset來取data-值，取值后屬性名格式同data()一樣
$('.box').each(function(){
    console.log($(this).data())
})
//{username: "zhd1"}
//{userName: "zhd2"}
//{username: "zhd3"}
//{userName: "zhd4"}
//{username: "zhd5"}
//{username: "zhd6"}
//{username: "zhd7"}

不同data-屬性名的格式，取值后的屬性名也不一樣。data-屬性名格式大概有以上7種情況。
從以上取值情況可以看出，區(qū)別就在data-屬性名是否用-隔開：
如果屬性名用-隔開，取值后的屬性名是駝峰格式。
如果屬性名是沒有用-隔開的字符串，無論大小寫，取值后的屬性名是小寫字符串。
以上是取data-值時需要注意的點。
眾所周知，jquery提供了可以操作HTML標簽屬性的方法---attr(),對應的js也有getAttribute()和setAttribute()兩種方法。如果說為了避免data()方法取值的屬性名問題，可以直接用以上方法操作。
接下來說說data()改變值的情況，首先我用此方法改變class="box1"的屬性值:

$('.box1').data('username','myname');

然后在控制臺看一下這個標簽data-值是否改變了：

WechatIMG928.jpeg

發(fā)現(xiàn)標簽上的值并沒有像我們預想的那樣改變。
如果打印一下試試看呢？

console.log($('.box1').data('username'))
//myname

雖然標簽上的屬性值沒有改變，但是通過以上操作，屬性值確實發(fā)生改變，只是沒有體現(xiàn)在標簽上而已。所以，一旦標簽上data-屬性值寫定，利用data()方法改變data-屬性值，并不會直接改變標簽上的屬性值。如果想改變標簽上的data-屬性值，請用jquery提供的attr()或者js的setAttribute()。

以上是個人見解，如有錯誤，請指正。多謝！