JavaScript控制html按钮显示和隐藏：item.style.display是‘none’还是‘’？

最近尝试用JavaScript控制html中的一个按钮button的显示和隐藏，遇到一个问题，在此记录一下。
先上代码：
html：

	<div id='controlBar'>
		<button class='control' id='settingBT' onClick="settingFunc()"><img id='settingImg' src="images/setting.png"/></button>
		<button class='control' id='plusBT'><img id='plusImg' src="images/plus.png"/></button>
		<button class='control' id='minusBT'><img id='minusImg' src="images/minus.png"/></button>	
	</div>

CSS：

	#plusBT {
		display:none;
	}
	#minusBT {
		display:none;
	}

javaScript：

function settingFunc() {
	var plus = document.getElementById('plusBT');
	var minus= document.getElementById('minusBT');
	console.log(plus.style);
				
	if (plus.style.display=='none'){
		plus.style.display = 'inline';
	}
}

以上代码实现的内容是：

• 在html建立了三个按钮；
• 在CSS中控制id='plusBT’和id='minusBT’的两个按钮不显示（display:‘none’)；
• 在javaScript中控制，按下id='settingBT’的按钮，触发函数settingFunc，判断上述两个按钮的display值，如果为‘none’，则令其为‘inline’，从而实现点击’settingBT’按钮控制’plusBT’和’minusBT’的两个按钮由隐藏变为显示的功能。

但是调试时点击’settingBT’按钮发现并没有显示期待的功能。
这时候在JavaScript中添加语句：

console.log(plus.style);

点击’settingBT’按钮后，在浏览器控制台中观察：
发现：display的值并不是’none’，而是‘’。因此，JavaScript中函数应该改为：

function settingFunc() {
	var plus = document.getElementById('plusBT');
	var minus= document.getElementById('minusBT');
	console.log(plus.style);
				
	if (plus.style.display==''){
		plus.style.display = 'inline';
	}
}

这样功能就正常了。