关于ie9placeholder的小折腾。placeholder属性定义：placeholder属性指定一个简短的提示，描述输入字段的预期值（例如：样本值或预期格式的简短描述）。问题来源：placeholder属性给了一个用户友好的提示，但是在旧的浏览器中是不行的（InternetExplorer9及之前的版本不支持placeholder属性），很头疼，所以就是下面的想法出现了。解决方案判断浏览器是否支持占位符属性'placeholder'indocument.createElement('input')获取当前页面中所有具有占位符属性的元素document.querySelectorAll('[placeholder]')因为document.querySelectorAll返回的是一个NodeList对象，需要通过Array.prototype.slice.call()转为数组，这样我们就可以通过数组Array.prototype.slice.call(文档.querySelectorAll('[placeholder]'))遍历获取到的页面节点中所有具有placeholder属性的元素.forEach()根据当前元素克隆同一个克隆节点（注：这里的思路是这样的，克隆同一个节点和插入到当前节点后面，当浏览器不支持placeholder属性时，需要显示placeholder属性的信息，然后显示克隆节点，隐藏当前节点)varcloneNode=item.cloneNode()判断节点的类型，如果节点的类型为[type="password"]，将克隆节点的类型改为textif(cloneNode.getAttribute('type').toLowerCase()==='password'){cloneNode.setAttribute('type','text')}将克隆节点的占位符属性值，写入值；并隐藏此克隆节点cloneNode.setAttribute('value',cloneNode.getAttribute('placeholder'))cloneNode。style.display='none'在当前节点item后面插入克隆节点。insertAdjacentHTML('afterend',cloneNode.outerHTML)为克隆节点绑定焦点事件，当克隆节点获得焦点时，克隆节点隐藏，the当前节点显示，当前节点获得焦点item.nextSibling.addEventListener('focus',function(){this.style.display='none'this.previousSibling.style.display='inline'this.previousSibling.focus()})绑定焦点事件到当前node，当当前节点获得焦点时，紧跟在当前节点之后的克隆节点将被隐藏。item.addEventListener('focus',function(){this.nextSibling.style.display='none'})给当前节点绑定blur事件，当当前节点失去焦点时，如果当前节点没有做任何输入，需要对齐为占位符提示，则隐藏当前节点，显示紧跟在当前节点之后的克隆节点item.addEventListener('blur',function(){if(!this.value){this.style.display='none'this.nextSibling.style.display='inline'}})页面初始化完成后判断当前节点是否有初始输入值，如果没有则隐藏当前节点并显示紧跟在当前节点之后的克隆节点if(!item.value){item.style.display='none'item.nextSibling.style.display='inline'}总体思路图document.createElement('input'))){//将返回的nodeList对象转换为数组varnodes=Array.prototype.slice.call(document.querySelectorAll('[placeholder]'))nodes.forEach(function(item,index){item.addEventListener('焦点',函数(){this.nextSibling.style.display='none'})item.addEventListener('blur',function(){if(!this.value){this.style.display='none'this.nextSibling.style.display='inline'}})varcloneNode=item.cloneNode()//如果[type='password']类型，则转为textif(cloneNode.getAttribute('type').toLowerCase()==='password'){cloneNode.setAttribute('type','text')}cloneNode.setAttribute('value',cloneNode.getAttribute('placeholder'))cloneNode.style.display='none'item.insertAdjacentHTML('afterend',cloneNode.outerHTML)item.nextSibling.addEventListener('focus',function(){this.style.display='none'this.previousSibling.style.display='inline'this.previousSibling.focus()})如果(!item.value){它em.style.display='none'item.nextSibling.style.display='inline'}})}由于我的知识有限，还有很多地方需要改进。我希望你能给我更多的建议
