display 與 visibility 的差別（隐藏Dom元素）

display 與 visibility

display與visibility都是用來隐藏Dom元素用的，他們的顯示效果幾乎沒有差别,但是他們還是存在一些不同的地方,我們來看看他們之間的一些異同

同:

(1)他們都能隐藏元素;document.getElementById("id").style.display = "none"; 或者.style.visibility = "hidden";

(2)他們都是css的屬性,從上面的用法已經能夠看出,應用時需要加上.style;

異：

(1)display将元素隐藏後,元素相當于從标準的文檔流中移除了，不在占據原本的位置；而visibility則完全相反；

(2)最大的一點差別就是效率問題了;因為display需要将元素從标準的文檔流中移除,那麼移除後則必定需要将整個的頁面重新進行加載,導緻了浏覽器的第二次解析,如果頁面中多處用到則必定會影響效率(但是現在的浏覽器解析速度确實要快很多了),這并不代表着任何時候都要用visibility，有時需要它不占據原有位置時那麼就必須使用display屬性了.

經驗：剛開始做項目時确實用display用得多,但是随着對js的深入了解,慢慢的會選擇最合适的用法，這也是我們必須學會的,沒有最好的用法,隻有最合适的用法(因具體的需求而異)