How to hide element value in javascript

How to hide element values in javascript: 1. Set the display in the element's style attribute, with statements such as "t.style.display= 'none';"; 2. Set the visibility in the element's style attribute.

The operating environment of this article: windows7 system, javascript version 1.8.5, DELL G3 computer

javascript hiding and showing elements

There are two ways to hide and show page elements:

Method 1: Set elements display

var t = document.getElementById('test');//选取id为test的元素 t.style.display = 'none'; // 隐藏选择的元素 t.style.display = 'block'; // 以块级样式显示

Method 2: Set the visibility

var t = document.getElementById('test'); t.style.visibility = 'hidden'; // 隐藏元素 t.style.visibility = 'visible'; // 显示元素

in the style attribute of the element. The difference between these two methods is: setting the display to hide does not occupy the original position, but through visibility After hiding, the element position is still occupied.
The effect is as follows:

The firstmethod hides before

does not hide after Occupy the original position

Second methodHide the previous position

Second method After hiding, it still occupies its original position.

The complete code is as follows:

  
  
 这是一个将要隐藏的p。
 这是一个将要隐藏的p。
 这是一个将要隐藏的p。
 这是一个将要隐藏的p。
 
 第一种方式 第二种方式 

Recommended learning: "javascript Advanced Tutorial"

The above is the detailed content of How to hide element value in javascript. For more information, please follow other related articles on the PHP Chinese website!