$ .addClass不会立即更新DOM吗？
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了$ .addClass不会立即更新DOM吗？相关的知识，希望对你有一定的参考价值。
请考虑以下代码段。
function foo(event) {
var $item = $(event.target);
$item.addClass("className");
bar(event);
};
function bar(event) {
var $item = $(event.target);
// The following return false
if ($item.hasClass("className")) {
// flow of control does not enter
}
};
我不是问如何解决这个问题。这显而易见：将$item的引用传递给bar函数。
我在问jQuery：
- 是否立即更新DOM？
- 什么时候更新？
- 如何明确更新？
- 最后，我在哪里可以读到这个？
答案
- 是否立即更新DOM？
是。立即。
- 什么时候更新？
DOM的属性/属性立即更新，您可以立即读取更改后的值。但UI呈现可能会延迟到javascript代码的末尾（UI呈现无关紧要）。
- 如何明确更新？
你不需要。
- 最后，我在哪里可以读到这个？
嗯......我认为DOM / ES标准可能包含这些内容。
你可以考虑设计的“正确行为”：谁能承受那些无法立即读取变化值的奇怪行为？一定是疯了。所以你的浏览器总能做正确的事情。 ：d
- 在这里看你的演示，没有任何问题（如果它不起作用，这是你的浏览器的问题，可能是错误的版本，或由一些错误的插件引起）
function foo(event) {
var $item = $(event.target);
$item.addClass("className");
bar(event);
};
function bar(event) {
var $item = $(event.target);
if ($item.hasClass("className")) {
$("#output").text("className changed!")
}
};
$(function(){
$("#test").on("click", foo);
})<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button id="test">click me</button>
<div id="output">hello</div>另一答案
你的代码应该按预期执行，它没有明显的问题，但是这可能会产生问题
当你执行addClass时，它会触发一个甚至更新class =''属性并删除你的className，这就是为什么这个条件
($item.hasClass("className"))
返回false
以上是关于$ .addClass不会立即更新DOM吗？的主要内容，如果未能解决你的问题，请参考以下文章
在 React 状态下，对象的值不会立即更新，任何人都可以解决这个问题吗？ [复制]