纯原生js手写兼容ie8、IE9placeholder插件

最近在做公司客户端的项目，是用IE浏览器解析的，而且是必须兼容到IE8，为了提高开发效率，兼容那最low的IE8，所以就写了个IEplaceholder.js插件，都是用纯原生js写的（发现网上都是jQuery写的，但是感觉原生的会轻便，而且也可以锻炼自己的js水平），IEplaceholder.js插件的源码如下：

 /*
  * 2019-3-7
  * zhongxiaouyou
  * 
  *解决placeholder在ie9及以下版本上无效的原生js(//兼容IE9及以下placeholder无效的bug)  
  *
  * @pcolor{颜色} 选填
  * 
  * */
function iePlaceholder(color) {
    var nodes = document.getElementsByTagName("input");
    //仅在不支持 placeholder 的时候执行(ie9及以下)
    if(nodes.length && !("placeholder" in document.createElement('input'))){
        var pcolor;//默认颜色
        if(color){
            pcolor = color;
        }else{
            pcolor = '#666666';//使用默认颜色
        }
        
        for(i=0;i<nodes.length;i++){
            var self = nodes[i];
            var inType = self.getAttribute("type") || 'text'; 
            var placeholder;
            //如果地址栏没获得值的情况下显示placeholder上的值             
            placeholder = self.getAttribute('placeholder') || ''; 
            
            //没有传值的情况下，填充placeholder的值
            if(!self.value){
                
                //填充非password框
                if(self.getAttribute("type")!="password"){
                    self.value = placeholder;
                    self.style.color = pcolor; 
                }else if(self.getAttribute("type")=="password"){                    
                    //对password框的特殊处理1.创建一个text框 2获取焦点和失去焦点的时候切换                   
                    var pwdVal = self.getAttribute('placeholder');          
                    //在该密码框后新增input，并设置type为text以及其他属性样式
                    var newItem=document.createElement("input");    
                    
                    newItem.setAttribute("type","text");
                    //IE9使用nextElementSibling,而IE8使用nextSibling
                    newItem.setAttribute("class","newText");
                    newItem.setAttribute("value",pwdVal);
                    newItem.setAttribute("autocomplete","off");
                    newItem.style.cssText = "color: "+pcolor+";"; 
                    insertAfter(newItem, self);
                     
                    //IE9使用nextElementSibling,而IE8使用nextSibling
                    nexts(self).style.display = "inline-block"; 
                    self.style.display = "none";
                }               
            }
            
            //点击获取焦点时消失
            self.onfocus = function(){              
                var pValue = this.value;
                var ph = this.getAttribute('placeholder');
                var pT = this.getAttribute("type");             
                //非密码框
                if(pValue == ph){
                    if(pT!='password'){
                        this.value = '';
                        this.style.color = '#000000';
                    }                   
                } 
                //this是代替密码框的元素
                if(this.getAttribute("class")=="newText"){                  
                    this.style.display = "none";                    
                    pres(this).style.display = "inline-block";
                    pres(this).focus();                 
                }               
            }
            
            //点击失去焦点时再判断显示
            self.onblur = function(){           
                var pValue = this.value;
                var ph = this.getAttribute('placeholder');
                var pT = this.getAttribute("type");             
                //密码框
                if(this.getAttribute("class")!="newText"){
                    var passType = this.getAttribute("type");
                    if(this.value == ''){                           
                        if(passType=='password'){                               
                            this.style.display = "none";
                            nexts(this).style.display = "inline-block";
                            nexts(this).style.color = pcolor;
                        }
                    }                  
                }
                //文本框
                if(pValue == ''){   
                    if(pT!='password'){                     
                        this.value = ph;
                        this.style.color = pcolor;
                    }
                }else{
                    this.style.color = '#000000';
                }       
            }               
        }
    }
    
}

//封装类似于jQuery里after()的函数,实现元素插入
function insertAfter(newElement, targetElement){            
    var parent = targetElement.parentNode;
    if (parent.lastElementChild == targetElement) {
        // 如果最后的节点是目标元素，则直接添加。因为默认是最后
        parent.appendChild(newElement);
    } else {
        parent.insertBefore(newElement, targetElement.nextSibling);
        //如果不是，则插入在目标元素的下一个兄弟节点 的前面。也就是目标元素的后面
    }
}

//使IE9兼容使用nextElementSibling,IE8使用nextSibling
function nexts(ele) {
    if (typeof ele.nextElementSibling == 'object') {
        return ele.nextElementSibling;
    }
    var n = ele.nextSibling;
    while (n) {
        if (n.nodeType == 1) {
            return n;
        }
        n = n.nextSibling;
    }
    return n;
}

//使IE9兼容使用previousElementSibling,IE8使用previousSibling
function pres(ele) {
    if (typeof ele.previousElementSibling == 'object') {
        return ele.previousElementSibling;
    }
    var m = ele.previousSibling ;
    while (m) {
        if (m.nodeType == 1) {
            return m;
        }
        m = m.previousSibling ;
    }
    return m;
}

然后直接在HTML页面引入IEplaceholder.js，并调入函数iePlaceholder(nodes，color)即可，需要注意的是，参数nodes为所有input节点元素（必填），color是设置placeholder的样式（选填）。具体代码如下：

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>让IE9及以下兼容placeholder</title>
        <script src="https://gitee.com/zhongxiaoyou1314520/codes/ywofe2smr0aut9lgikjpv85/raw?blob_name=IEplaceholder.min.js"></script>
    </head>
    <body>
        <input type="text" name="username" id="username" value="" placeholder="请输入用户名"/>
            <input type="text" name="user" id="user" value="" placeholder="请输入昵称"/>
            <input type="password" name="pass1" id="pass1" value="" placeholder="请输入密码"/>
            <input type="password" name="pass2" id="pass2" value="" placeholder="请再次输入密码"/>
            <input type="button" value="按钮" />
    </body>
    <script type="text/javascript" charset="UTF-8">
        //使用插件
        iePlaceholder();
        
        
    </script>
</html>

因为第一次写插件，许多不足之处还请各位大神多多指教