ノードHTMLコードは次のとおりです。
コードコピーは次のとおりです。
<div id = "img_1">
<input type = "image" src = "img/cump.png"> </input>
<div id = "notetxt" type = "text" ondblclick = "changename（this.id）;"> 123 </div>
</div>
JS編集notetxtテキスト、関数は次のとおりです。
コードコピーは次のとおりです。
function changename（notetxtid）{
var notetxt = document.getElementById（notetxtid）;
notetxt.style.display = "none"; //。style.display = "block"
var div = notetxt.parentnode;
if（！document.getElementById（ "noteinput"））{
var text = 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.select（）;
text.onblur = function（）{
notetxt.style.display = "block";
notetxt.innerhtml = text.value;
//text.style.display= "none";
div.RemoveChild（テキスト）;
}
}
}
// CSSファイルでスタイルを取得します
関数getStyle（obj、attr）
{
if（obj.currentstyle）
{
obj.currentStyle [attr]を返します。 // IE
}それ以外{
return getComputedStyle（obj、false）[attr]; // ff
}
}
CSSは次のとおりです。
コードコピーは次のとおりです。
.img_1 {
幅：80px;
高さ：70px;
位置：絶対;
}
.noteText {
幅：80px;
高さ：15px;
テキストアライグ：センター;
マージントップ：70px;
ワードブレイク：ブレークオール;
}
コードは非常にシンプルなので、ここでは説明しません。友人は自由にそれを使用して、自分のプロジェクトで使用できます。