JavaScript

Conditional expression checks.

条件式の挙動チェック

　数値を入れて、「Check」ボタンを押すとそれぞれの数値を比較した時の結果、 true（条件が成立した場合）か false（条件が不成立の場合）が表示されます。

a:
b:
a == b
:
a != b
:
a < b
:
a > b
:
a <= b
:
a >= b
:

HTML

<div>
	a:<input id="i0" type="number" value="3"><br>
	b:<input id="i1" type="number" value="5"><br>
	<button onclick="check()">Check</button>

	<div class="container">
		<div>a == b</div>
		<div>:</div>
		<div><span id="r0"></span></div>
		
		<div>a != b</div>
		<div>:</div>
		<div><span id="r1"></span></div>
		
		<div>a < b</div>
		<div>:</div>
		<div><span id="r2"></span></div>
		
		<div>a > b</div>
		<div>:</div>
		<div><span id="r3"></span></div>
		
		<div>a <= b</div>
		<div>:</div>
		<div><span id="r4"></span></div>
		
		<div>a >= b</div>
		<div>:</div>
		<div><span id="r5"></span></div>
	</div>
</div>

CSS

.container {
	display: grid;
	grid-template-columns: 5em 1em 4em;
}

.container div {
	text-align: center;
}

JavaScript

function check() {
	let a = document.getElementById('i0').value;
	let b = document.getElementById('i1').value;
	document.getElementById('r0').textContent = (a == b);
	document.getElementById('r1').textContent = (a != b);
	document.getElementById('r2').textContent = (a < b);
	document.getElementById('r3').textContent = (a > b);
	document.getElementById('r4').textContent = (a <= b);
	document.getElementById('r5').textContent = (a >= b);
}