Question

我有一个简单的html页面有一个按钮切换div，但是一切正常，但我的代码中有一个if-else语句，如下所示：

 if (info.style.display === '' || info.style.display == 'none'){
    info.style.display =  'inline-block';
} else {
     info.style.display =  'none';
}

我决定使用这样的简短陈述;

 info.style.display === ''||info.style.display ==='none' ? info.style.display = 'inline-block' :info.style.display = 'none';

但仍感觉太长，可能会干燥，

嗯，我有两种方法，但每种方法都不正确：

// this solution works but requires two clicks first time run:

 info.style.display ==( ''||'none' ) ?info.style.display = 'inline-block' :info.style.display = 'none';

和：

 // this solution doesn't work:
  info.style.display == (''||'none' ? 'inline-block' : 'none');

她是>>> My Plunker <<< 对此有什么想法吗？谢谢..

Answer 1

实际上这是使用这个简短的if-else语句的正确方法

info.style.display = (info.style.display === '' || info.style.display === 'none') ? 'inline-block' : 'none';

Answer 2

由于您总是分配，只需将条件放在右边;你也可以（如果你真的想）使用!info.style.display代替info.style.display == ''：

info.style.display = !info.style.display || info.style.display === 'none' ? 'inline-block' : 'none';

甚至利用curiously-powerful || operator虽然我不确定我是否会这样做：

info.style.display = (info.style.display || 'none') === 'none' ? 'inline-block' : 'none';

这是有效的，因为'' || 'none'会产生'none'，但'anything_else' || 'none'会产生'anything_else'。

在javascript中无法干掉if-else（条件三元运算符）的短手

2 个答案: