Question

我有一个小例子：

＆＃13;

let length = $('body > p').length;
console.log(length);

$('body').append($('<p>').text('plain text'));
console.log(length);

setTimeout(() => console.log(length), 1000)

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>

＆＃13;

我的问题：在追加后，为什么不会length更新新值（1）？我在尝试登录之前尝试延迟1秒，但结果相同。为什么呢？

Answer 1

这是因为在附加元素之前解析/评估了let length = $('body > p').length。

在附加元素后，它不再被解析。

你可以创建功能＆amp;叫它

function showLength(){
 let length = $('body > p').length;
console.log(length);
}

同样在setTimeout长度内不是要执行的函数

在你的代码中调用它

showLength();
$('body').append($('<p>').text('plain text'));
showLength();

setTimeout(function(){showLength();}, 1000)

Answer 2

因为您在变量上存储了旧的$('body > p')元素，并且打印了两次相同的结果。

let length = $('body > p').length;
console.log(length);

存储当前'body > p'的长度，它存在，然后是0。

$('body').append($('<p>').text('plain text'));
console.log(length);

您附加了新元素，但是您正在打印OLD元素长度值，因此再次获得0，您需要“刷新”该元素。

这样的事情：

let length = $('body > p').length;
console.log(length);

$('body').append($('<p>').text('plain text'));
length = $('body > p').length;
console.log(length);

setTimeout(() => console.log(length), 1000)

当你做这样的事情时使用jQuery：

var element = $('element');

您正在生成元素的“快照”，这意味着元素在您声明它的那一刻就存储在变量中。如果元素发生变化但你没有刷新变量，它将返回与你声明它时相同的值。

Answer 3

在JavaScript中，无论何时调用变量，都不会重新评估变量。在您的情况下，您在脚本开头将length的值设置为0，只要您不将其设置为0，它就会保持等于length = ... var length = $('body > p').length; console.log(length); $('body').append($('<p>').text('plain text')); length = $('body > p').length; console.log(length);的另一个值。因此，为了使您的示例有效，您需要执行以下操作：

<input type="button" @click="nb += 1" class="btn btn-default" value="Add New Section">
<div v-for="a in nb">
   <block v-if="nb == 4" block_class="{'col-md-3': true, 'col-sm-6': true, 'col-xs-6': true"></block>
</div>

Answer 4

在您的示例中，length变量是一个基本类型的数字。在javascript中，原语是不可变的。

请看一下：https://developer.mozilla.org/en-US/docs/Web/JavaScript/Data_structures#Data_types

jquery中的对象引用

4 个答案: