第一种不保留位置,第二种保留位置。

源码

<head>

    <script type="text/javascript">

        function fn1(){

            var t = document.getElementById('test');

            if(t.style.display === 'none') {

                t.style.display = 'block';// 以块级元素显示

            } else {

                t.style.display = 'none'; // 隐藏

            }

        }

        function fn2(){

            var t = document.getElementById('test');

            if(t.style.visibility === 'hidden') {

                t.style.visibility = 'visible';

            } else {

                t.style.visibility = 'hidden';

            }

        }

    </script>

</head>

<body>

    <p id="test" style="border: solid 1px #e81515; width:500px;">

        这是一个将要隐藏的p。<br>

        这是一个将要隐藏的p。<br>

        这是一个将要隐藏的p。<br>

        这是一个将要隐藏的p。<br>

    </p>

    <button onclick="fn1()">第一种方式</button>

    <button onclick="fn2()">第二种方式</button>

</body>

转载:javascript怎么隐藏元素值-木庄网络博客
https://www.muzhuangnet.com/show/58453.html