平常設計表單的時候，我們會加入一些提示文字，比如說在搜尋框裡，我們會提示“請輸入關鍵字”，並在搜尋框得到焦點和失去焦點的時候適時的隱藏和顯示，最常見的做法是利用value來設定：
<script> <BR>document.getElementById("keyword").onfocus = function() { <BR>if (document.getElementById("keyword").value == "請輸入關鍵字") { <BR>document.getElementById("keyword").value = ""; <BR>} <BR>} <BR>document.getElementById("keyword").onblur = function() { <BR>if (documIdent.getElementByIdent. ("keyword").value == "") { <BR>document.getElementById("keyword").value = "請輸入關鍵字"; <BR>} <BR>} <BR>document.getElementById(" search").onsubmit = function() { <BR>var keyword = document.getElementById("keyword").value; <BR>if (keyword == "" || keyword == "請輸入關鍵字") { <BR>alert("請輸入關鍵字"); <BR>return false; <BR>} <BR>return true; <BR>} <BR></script>
如此的程式碼雖然實現了我們要的功能，但卻不乾淨，原因在於「請輸入關鍵字」這樣的文字僅僅是提示文字而已，而不是value，雖然技術上沒有大問題，但很多時候還是顯得麻煩，比如說我們可能像讓提示文字顯示的顏色是灰色，而使用者鍵入的文字則顯示黑色。
下面看看如何利用css來實現更好的方式：
<script> <BR>window.onload = function() { <BR>if (!document.getElementById("keyword").value) { <BR>document.getElementById("description").style.display = "inline"; <BR>} <BR>}; <BR>document.getElementById("keyword").onfocus = function() { <BR>if (!document.getElementById("keyword").value) { <BR>document. getElementById("description").style.display = "none"; <BR>} <BR>} <BR>document.getElementById("keyword").onblur = function() { <BR>if (!document.getElementById ("keyword").value) { <BR>document.getElementById("description").style.display = "inline"; <BR>} <BR>} <BR>document.getElementById("search").onsubmit = function() { <BR>if (!document.getElementById("keyword").value) { <BR>alert("請輸入關鍵字"); <BR>return false; <BR>} <BR>return true; <BR>} <BR></script>
這樣的實作方式雖然CSS，JS程式碼都多了一些，但是結構更合理，透過引入label來顯示提示文字（透過CSS的position屬性定位），讓value本身更單純，提示文字和使用者輸入的文字在樣式上更容易控制，例如顏色的深淺，從而提高表單可用性。
