js隐藏网页元素

获取⽹页元素

document.getElementsByName(\"title\");document.getElementsByTagName(\"title\");document.getElementsByClassName(\"title\");

利⽤来JS控制页⾯控件显⽰和隐藏有两种⽅法，两种⽅法分别利⽤HTML的style中的两个属性，两种⽅法的不同之处在于控件隐藏后是否还在页⾯上占空位。⽅法⼀：

document.getElementById(\"EleId\").style.visibility=\"hidden\";document.getElementById(\"EleId\").style.visibility=\"visible\";

　　利⽤上述⽅法实现隐藏后，页⾯的位置还被控件占⽤，显⽰空⽩。⽅法⼆：

document.getElementById(\"EleId\").style.display=\"none\";document.getElementById(\"EleId\").style.display=\"inline\";

　　利⽤上述⽅法实现隐藏后，页⾯的位置不被占⽤。

如果是 ByClassNam 或者 ByTagName ，例如

document.getElementsByClassName(\"title\").style.display=\"none\"

会报错：Uncaught TypeError: Cannot set property 'display' of undefined

因为得到的是⼀个由class=\"xxx\"的所有元素组成的集合，⽽不是单个元素；集合是没有display属性的，集合中的元素才有display属性。当你试图做 集合.style.display的时候，⾃然会报错。正确⽅法是加上⼀个下标，

document.getElementsByClassName(\"title\")[0].style.display='none'

或者遍历让集合所有的元素⽣效

var x=document.getElementsByClassName(\"title\"); for (var i = 0; i