Question

有人可以解释这种jQuery行为。我有data-hello属性，当我调用.removeData('hello')时，我希望它不会影响任何东西，因为该属性仍然存在，并且下一个.data()调用应仅从该属性中重新获取值。 data-hello属性。为什么然后在下面的代码中没有这样做。

console.log($('.outer').data())

//removing jquery data (should only remove jquery cache?)
$('.outer').removeData('hello')

// attribute is still there but .data() call not getting it
console.log($('.outer').data())
console.log($('.outer').attr('data-hello'))

<div class="outer" data-hello=1 >hello</div>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

描述预期行为https://api.jquery.com/removeData/

的文档

请注意，.removeData（）只会从jQuery内部删除数据 .data（）缓存，以及元素上的任何相应数据属性将不会被删除。因此，以后对data（）的调用将重新检索来自data-属性的值。

Answer 1

因为jQuery的data()返回内部缓存。由于您已删除密钥hello，因此data()不应再看到hello。

如果再次读取密钥hello，它将进入数据内部缓存，那么data()可以再次看到它。

请参见下面的演示

console.log('init data(): ' + JSON.stringify($('.outer').data()))

//removing jquery data key from jquery data cache
$('.outer').removeData('hello')

// attribute is still there, .data() call not getting it
console.log('removed data(): ' + JSON.stringify($('.outer').data()))

// read the key again, it comes from the html attribute to the cache
console.log('call data(hello): ' + JSON.stringify($('.outer').data('hello')))

// then the data() can see the key
console.log('then data(): ' + JSON.stringify($('.outer').data()))

console.log($('.outer').attr('data-hello'))

<div class="outer" data-hello=1 >hello</div>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

jQuery .removeData（）无法正常运行

1 个答案: