js实现编辑div节点名称的方法
本文实例讲述了js实现编辑div节点名称的方法。分享给大家供大家参考。具体实现方法如下：
节点html代码如下：
<divclass="img_1"id="img_1">
<inputtype="image"class="img_1"src="img/cump.png"></input>
<divclass="noteText"id="noteTxt"type="text"ondblclick="changeName(this.id);">123</div>
</div>js编辑noteTxt文本，function如下：
functionchangeName(noteTxtId){
varnoteTxt=document.getElementById(noteTxtId);
noteTxt.style.display="none";//.style.display="block"
vardiv=noteTxt.parentNode;
if(!document.getElementById("noteInput")){ vartext=document.createElement("input"); text.type="text"; text.id="noteInput";
text.style.width=getStyle(noteTxt,'width'); text.style.height=getStyle(noteTxt,'height'); text.style.marginTop=getStyle(noteTxt,'marginTop'); text.style.textAlign=getStyle(noteTxt,'textAlign');
text.value=noteTxt.innerHTML; div.appendChild(text); text.select(); text.onblur=function(){ noteTxt.style.display="block"; noteTxt.innerHTML=text.value; //text.style.display="none"; div.removeChild(text); } } }
//获得css文件中的样式 functiongetStyle(obj,attr) { if(obj.currentStyle) { returnobj.currentStyle[attr]; //IE }else{ returngetComputedStyle(obj,false)[attr]; //FF } }