網頁中經常會看到顯示和隱藏的效果，可通過display屬性來設定，//語法：Object.style.display = value; 其中Object是獲取的元素物件，如通過document.getElementById("id")獲取的元素，
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <title>顯示隱藏display屬性</title> 6 <script type="text/javascript"> 7 function yc(){ 8 var myceshi=document.getElementById('ceshi'); 9 myceshi.style.display='none'; 10 } 11 function xs(){ 12 var myceshi=document.getElementById('ceshi'); 13 myceshi.style.display='block'; 14 } 15 </script> 16 </head> 17 <body> 18 <div id="ceshi"> 19 <ul> 20 <li>DOM樹定義了HTML/XML檔案的邏輯結構，給出了一種應用程式訪問和處理XML檔案的方法，</li> 21 <li>在DOM樹中，有一個根節點，所有其他的節點都是根節點的后代，</li> 22 <li>在應用程序中，基于DOM的HTML/XML分析器將一個HTML/XML檔案轉換成一棵DOM樹，應用程式通過對DOM樹的操作，來實作對HTML/XML檔案資料的操作，</li> 23 </ul> 24 </div> 25 <form action="" method=""> 26 <input type="button" name="" id="" value="點擊隱藏" onclick="yc()"/> 27 <input type="button" name="" id="" value="點擊顯示" onclick="xs()"/> 28 </form> 29 </body> 30 </html>
其中value的值有none和block, myceshi.style.display='none'是為此元素不會被顯示（即隱藏），myceshi.style.display='block'此元素將顯示未塊級元素（即顯示）
轉載請註明出處，本文鏈接：https://www.uj5u.com/qiye/141463.html
標籤：JavaScript
上一篇：js通過Object.style.property=new style;改變html樣式
下一篇：Vue(一)