Placeholder performance and compatibility

(1) A newly added attribute in HTML5, applied to input and textarea, is shown as a gray font prompt in the text box; after focusing, the prompt is hidden

(2) Compatibility: Browsers that can support HTML5: IE10, Firefox, Chrome, Safari, etc., lower versions do not support ( IE5-IE9 )

        (A) Compatible with all browsers (IE6-IE9)

function placeHolder(){
if(nodes.length && !("placeholder" in document_createElement_x("input"))){
          for(i=0;i<nodes.length;i++){
              var self = nodes[i],
                  placeholder = self.getAttribute('placeholder') || '';     
              self.onfocus = function(){
                  if(self.value == placeholder){
                     self.value = '';
                     self.style.color = "";
                  }               
              }
              self.onblur = function(){
                  if(self.value == ''){
                      self.value = placeholder;
                      self.style.color = pcolor;
                  }              
              }                                       
              self.value = placeholder;  
              self.style.color = pcolor;              
          }
      }
}

        (B) Consistent performance

                Use label or background image focus to hide

        (C) The position of IE10 is too low , causing the page to be ugly: use a hack

padding-bottom:5px\0;

(3) the difference between : Chrome, Firefox in the focus prompt does not hide, enter only the hidden content

(4) How to modify the text and prompt style of the text box ? For example, text: red prompt: pink

color:red;
//ff
::-moz-placeholer:pink; 
//chrome safari
::-webkit-input-placeholder:pink;
//IE10
:-ms-input-placeholder:pink;