1. Home
  2. /
  3. Jsbin
  4. /
  5. JS Bin Hide and Show

JS Bin Hide and Show - Jsbin Typing CST Test

Loading…

JS Bin Hide and Show — Jsbin Code

Shows or hides a paragraph when a button is clicked.

<!DOCTYPE html>
<html>
<head>
	<title>Hide/Show</title>
</head>
<body>
	<p id="para">Hello! Toggle my visibility.</p>
	<button id="btn">Toggle</button>

	<script>
		document.getElementById('btn').onclick = function() {
		let p = document.getElementById('para');
		p.style.display = (p.style.display==='none') ? 'block' : 'none';
		};
	</script>
</body>
</html>

Jsbin Language Guide

JSBin is an online code editor focused on web development that allows users to write and test HTML, CSS, and JavaScript in real-time. It is designed for rapid prototyping and debugging of web code directly in the browser.

Primary Use Cases

  • ▸Rapid prototyping of HTML, CSS, and JavaScript
  • ▸Testing small code snippets and debugging
  • ▸Sharing live examples of web code
  • ▸Learning front-end development interactively
  • ▸Collaborating on small web projects via shared links

Notable Features

  • ▸Live preview of HTML, CSS, and JS code
  • ▸Real-time console for JavaScript output
  • ▸Shareable links for collaborative testing
  • ▸Supports multiple panels for HTML, CSS, and JS
  • ▸Embeddable code snippets for blogs or tutorials

Origin & Creator

JSBin was created by Remy Sharp in 2009 to provide a simple, accessible online platform for testing and sharing web code snippets.

Industrial Note

Widely used by web developers for prototyping and debugging front-end code. Not suitable for full-stack development or large-scale production projects.

More Jsbin Typing Exercises

Hello World in JS BinJS Bin Button Click ExampleJS Bin Input Echo ExampleJS Bin Color ChangerJS Bin Clock ExampleJS Bin Random Number GeneratorJS Bin List AdderJS Bin Simple CalculatorJS Bin Toggle Dark Mode

Practice Other Languages

CReactPythonC++RustTypeScriptKotlinPHPJavaC#RubyMqlCqlN1qlCypher