Question

我必须相信有更好的方法来编写下面的代码。提前谢谢。

var hProtein = $('#protein-lbl');
var hCarb = $('#carb-lbl');
var hFat = $('#fat-lbl');
var hTotal = $('#totalCalories');

// Normal Calc vars
var nProtein = $('#protein-normal-lbl');
var nCarb = $('#carb-normal-lbl');
var nFat = $('#fat-normal-lbl');
var nTotal = $('#totalCalories-normal');

// Hide calculations until bodyweight is entered
hProtein.hide();
hCarb.hide();
hFat.hide();
hTotal.hide();
nProtein.hide();
nCarb.hide();
nFat.hide();
nTotal.hide();

Answer 1

也许给HTML元素一个类会起作用吗？

var $ele = $('.class-name');
$ele.hide();

Answer 2

最好的解决方案是在HTML / CSS中指定页面的默认条件，因此它首先显示正确，您不必运行一堆javascript来设置默认条件。

因此，如果您要执行的操作是在页面加载时建立默认条件，请将所有这些元素的显示样式更改为HTML中的style="display: none;"，以便它们以正确的状态开始。

或者更好的是，给它们一个共同的类名并创建一个CSS样式规则，这样它们最初都是隐藏的。在标记/ CSS中执行此操作将阻止它们在脚本运行时显示然后隐藏 - 它们将以正确的状态开始。

CSS：

.initialHidden {
     display: none;
}

HTML：

<div id="totalCalories-normal" class="initialHidden"></div>

Answer 3

将元素添加到元素中以这种方式隐藏它

$('.common-class-name').hide()

OR

将所有元素放在单个div换行中并用该ID

隐藏它

Answer 4

我会这样做：

$([
    '#protein-lbl',
    '#carb-lbl',
    '#fat-lbl',
    '#totalCalories',
    '#protein-normal-lbl',
    '#carb-normal-lbl',
    '#fat-normal-lbl',
    '#totalCalories-normal'
].join()).hide();

Answer 5

为什么不将标签包装在字段集中并隐藏字段集

我怎样才能更有效地重写这一点

5 个答案: