Free programming examples and instructions

Javascript Hide html control

code, demo for how to hide html control in javascript

by Athil

Posted on 11 May 2017 Category: Javascript Views: 1346

Edited on 25 Jul 2018


Hi, Here I am going to show how to hide an HTML control using javascript.

 document.getElementById('control-id').style = "display:none";

Full Code


<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
    <h1>Demo for hide/Show  in javascript </h1>

    <input type="text" id="txt1"/> <br/>
    <button type="submit" onclick="HideControl();">Hide </button>
    <button type="submit" onclick="ShowControl();">Show </button>

        function HideControl()
            document.getElementById('txt1').style = "display:none";
        function ShowControl()
            document.getElementById('txt1').style = "display:block";


Related Articles

How to show hidden controls using javascript

How to hide a control using jQuery

How to show hidden controls in jQuery

Show and hide controls in single Event

Leave a Comment: