js搜索框显示隐藏文本框内容

描述 当鼠标点击文本框时，里面的默认文字隐藏，当鼠标离开文本框时，里面的文字显示。
分析
①首先表单需要2个新事件，获得焦点 onfocus 失去焦点 onblur
② 如果获得焦点， 判断表单里面内容是否为默认文字，如果是默认文字，就清空表单内容
③ 如果失去焦点， 判断表单内容是否为空，如果为空，则表单内容改为默认文字

<script>
        var text = document.querySelector('input');      
        text.onfocus = function() {         
              if (this.value == "手机") {              
               this.value = "";           
               }           
               this.style.color = '#333';       
        }       
         text.onblur = function() {          
                 if (this.value == "") {              
                 this.value = "手机";        
                 }            
                 this.style.color = '#999';      
            }
</script>