Javascript 在jquery中正确减去变量

这是我写过的第一批函数……它是有效的，但我想知道是否还有另一种更有效的方法可以将变量I限制在0以下，5以上，而不是在每个变量中使用那些额外的if语句。单击（）…那么代码也是非常小的，所以这可能是限制变量的最有效的方法

var i=0;
$(".add").click(function(event){
    if(i < 5) {
        var container = $('div');
        container.append($("<p class='blabla'>blablabla</p>"));
        if(i < 5){i++}
    }
});

$(".delete").click(function(event){
    if(i < 5, i > 0){i--}
    $("div p:last-of-type").remove();
});

var i=0；
$（“.add”）。单击（函数（事件）{
如果（i<5）{
变量容器=$（'div'）；
container.append（$（“
blablabla
”）；
如果（i<5）{i++}
}
});
$（“.delete”）。单击（函数（事件）{
如果（i<5，i>0）{i--}
$（“div p:type的最后一个”）.remove（）；
});

您不需要第二次签入

if（i您不需要第二次签入
if（i
在每个
中生成这些额外的if语句。单击（）

它们是必要的，很好。不过，你可以把它们缩短一点

内部的
if
条件是多余的。其间没有任何变化
i
，因此您无需再次检查

另一种不使用计数器变量
i
的方法是每次对现有元素进行计数：

$(".add").click(function(event){
    var container = $('div');
    if (container.find("p").length < 5) {
        container.append("<p class='blabla'>blablabla</p>");
    }
});
$(".delete").click(function(event){
    $("div p:last-of-type").remove(); // if nothing is found nothing is removed anyway
});

$（“.add”）。单击（函数（事件）{
变量容器=$（'div'）；
if（容器查找（“p”）.长度<5）{
container.append（“
blablabla
”；
}
});
$（“.delete”）。单击（函数（事件）{
$（“div p:type的最后一个”）.remove（）；//如果未找到任何内容，则不会删除任何内容
});

在每个
中生成这些额外的if语句。单击（）

它们是必要的，很好。不过，你可以把它们缩短一点

内部的
if
条件是多余的。其间没有任何变化
i
，因此您无需再次检查

另一种不使用计数器变量
i
的方法是每次对现有元素进行计数：

$(".add").click(function(event){
    var container = $('div');
    if (container.find("p").length < 5) {
        container.append("<p class='blabla'>blablabla</p>");
    }
});
$(".delete").click(function(event){
    $("div p:last-of-type").remove(); // if nothing is found nothing is removed anyway
});

$（“.add”）。单击（函数（事件）{
变量容器=$（'div'）；
if（容器查找（“p”）.长度<5）{
container.append（“
blablabla
”；
}
});
$（“.delete”）。单击（函数（事件）{
$（“div p:type的最后一个”）.remove（）；//如果未找到任何内容，则不会删除任何内容
});
在您的示例中，实际上不需要变量
i
，因为您可以简单地计算元素的数量

$(".add").click(function () {
    if ($('div').children('p').length < 5) {
        $('div').append('<p>item</p>');
    }
});

在您的示例中，实际上不需要变量
i
，因为您可以简单地计算元素的数量

$(".add").click(function () {
    if ($('div').children('p').length < 5) {
        $('div').append('<p>item</p>');
    }
});

不要计数，而是使用要控制的最大值，并让jQuery执行其余操作：


添加

德尔
附属器

然后：

var gv_nMax=5；
$（“.add”）。单击（函数（事件）{
如果（$（“div p”）.长度blablabla
”）
});
$（“.delete”）。单击（函数（事件）{$（“div p:type的最后一个”）.remove（）；}）；
使用要控制的最大值，而不是计数，并让jQuery执行其余操作：


添加

德尔
附属器

然后：

var gv_nMax=5；
$（“.add”）。单击（函数（事件）{
如果（$（“div p”）.长度blablabla
”）
});
$（“.delete”）。单击（函数（事件）{$（“div p:type的最后一个”）.remove（）；}）；
非常感谢！我希望你能选择多个答案，但我选择了你的答案，因为你在gvee的答案中添加了一个新的答案，这向我展示了一种新的方法，而且你的声誉比下面的人要低……除了你的答案是狗屎，哈哈……再次感谢！谢谢：）。我在打电话，否则我会更快。对不起！；）@gvee的最接近我的，只是提取了最大值。请记住，页面越复杂，您希望选择器越具体<代码>div p
将获得div下的所有p。非常感谢！我希望你能选择多个答案，但我选择了你的答案，因为你在gvee的答案中添加了一个新的答案，这向我展示了一种新的方法，而且你的声誉比下面的人要低…除了你的答案是狗屎，哈哈…再次感谢！谢谢：）。我在打电话，否则我会更快。对不起！；）@除了提取最大值之外，gvee最接近我的选择。请记住，页面越复杂，您希望选择器越具体<代码>div p
将在一个div下获得所有p。感谢您为我展示了这种新方法！我之前研究过长度，但不确定它是如何工作的……在我的词汇表中添加了一个新的jquery术语，我很感激！我本来想给你答案的，但是williambq对此进行了扩展，没有那么多的代表。再次感谢大家！谢谢你给我展示这条新路！我之前研究过长度，但不确定它是如何工作的……在我的词汇表中添加了一个新的jquery术语，我很感激！我本来想给你答案的，但是williambq对此进行了扩展，没有那么多的代表。再次感谢大家！感谢Bergi的解释，你真的帮助我理解了代码的所有部分！我决定给williambq一个答案，因为即使你的答案是“老板”，他也没那么受欢迎，希望你不要生气……你的狗屎！感谢Bergi的解释，你真的帮助我理解了代码的所有部分！我决定给williambq一个答案，因为即使你的答案是“老板”，他也没那么受欢迎，希望你不要生气……你的狗屎！
$(".add").click(function(event){
    var container = $('div');
    if (container.find("p").length < 5) {
        container.append("<p class='blabla'>blablabla</p>");
    }
});
$(".delete").click(function(event){
    $("div p:last-of-type").remove(); // if nothing is found nothing is removed anyway
});

$(".add").click(function () {
    if ($('div').children('p').length < 5) {
        $('div').append('<p>item</p>');
    }
});

$(".add").click(function () {
    if ($('div p').length < 5) {
        $('div').append('<p>item</p>');
    }
});

$(".delete").click(function () {
    $('div p:last-of-type').remove();
});

<a class='add'>Add</a><br/>
<a class='delete'>Del</a>
<div class='add'>AppendToMe</div>

var gv_nMax = 5;

$(".add").click(function(event){
    if($("div p").length < gv_nMax) 
    $('div').append($("<p class='blabla'>blablabla</p>"))
});
$(".delete").click(function(event){ $("div p:last-of-type").remove(); });