私はテキストエディタで作業しています。ユーザーが特定の<div>
をダブルクリックすると、contentEditable
プロパティはtrue
に設定され、いくつかのエディタツールが表示されます。次に、ユーザーは「保存」と「エスケープ」をクリックするかどうかを選択できます。彼がエスケープするならば、私はこの<div>
の前のデータを復元したい。.html()と.innerHTML
3
A
答えて
2
これら2つは事実上同じです。しかし、jQueryのは、あなたの方法で取得される可能性がありますいくつかの前処理を行います...
jQueryのグローバルまっすぐだ
rnoInnerHtml = /<(?:script|style)/i;
rtagName = /<([\w:]+)/;
rleadingWhitespace = /^\s+/;
rxhtmlTag = /<(?!area|br|col|embed|hr|img|input|link|meta|param)(([\w:]+)[^>]*)\/>/gi;
wrapMap = {
"option": [1, "<select multiple='multiple'>", "</select>"],
"legend": [1, "<fieldset>", "</fieldset>"],
"thead": [1, "<table>", "</table>"],
"tr": [2, "<table><tbody>", "</tbody></table>"],
"td": [3, "<table><tbody><tr>", "</tr></tbody></table>"],
"col": [2, "<table><tbody></tbody><colgroup>", "</colgroup></table>"],
"area": [1, "<map>", "</map>"],
"_default": [0, "", ""],
"optgroup": [1, "<select multiple='multiple'>", "</select>"],
"caption": [1, "<table>", "</table>"],
"colgroup": [1, "<table>", "</table>"],
"tfoot": [1, "<table>", "</table>"],
"tbody": [1, "<table>", "</table>"],
"th": [3, "<table><tbody><tr>", "</tr></tbody></table>"]
};
.htmlを(値)セッター
var elem = this[0] || {},
i = 0,
l = this.length;
if (typeof value === "string" && !rnoInnerhtml.test(value) &&
(jQuery.support.leadingWhitespace || !rleadingWhitespace.test(value)) &&
!wrapMap[(rtagName.exec(value) || ["", ""])[1].toLowerCase()]) {
value = value.replace(rxhtmlTag, "<$1></$2>");
try {
for (; i < l; i++) {
// Remove element nodes and prevent memory leaks
elem = this[i] || {};
if (elem.nodeType === 1) {
jQuery.cleanData(elem.getElementsByTagName("*"));
elem.innerHTML = value;
}
}
elem = 0;
// If using innerHTML throws an exception, use the fallback method
} catch(e) {}
}
if (elem) {
this.empty().append(value);
}
現在のバージョンのセッターについて.html(string)
so基本的にあなたがvalue
(1)が文字列でない場合、(2)スクリプトタグを持つ場合、(3)あなたが先頭の空白をサポートしていないブラウザで文字列が切り詰められていない場合、 wrapMap
特殊なユースケースに該当OR(5)innerHTMLプロパティは、他の理由で失敗した... THENあなたは、本質的に `TEMP [「htmlTxt」]は何
1
それはに完全に依存して...それは古典的なJavaScriptを使用して正常に動作していないjQueryを使って、なぜ
$('#esc').click(function() {
var confEsc = confirm('---\n\nSouhaitez-vous quitter sans enregistrer vos modifications ?\n\n---');
if(confEsc) {
//Do you know why that works :
var id = document.getElementById(temp['myId']);
id.innerHTML = temp['htmlTxt'];
//and why that doesn't work ?
$('#'+temp['myId']).html(temp['htmlTxt'])
}
});
が、私は理解していない。だから私は、最初のダブルクリック(temp['htmlTxt']
)と上のデータをコピーしますtempの内容['htmlTxt']私は思います。 .html()を使用してjQueryがこれを取り除くと、ページ上に(<script type="text/javascript"><script>
のようなタグとして)javascriptを挿入しようとしている人を見てきました。
しかし、面白くないノートでは、DOMは文字列ではありません。 innerHTMLは古いブラウザ間で漏洩する傾向があります。 .innerHTML以外のプロパティを使用することを検討してください。
関連する問題
- 1. htmlを使わないinnerHTML、テキストのみ
- 2. Htmlの敏捷性パックinnerHTMLプロパティは、テキストボックス
- 3. divのinnerHTMLのオブジェクトアクセスの親HTMLのdiv
- 4. JavascriptとXML innerHTMLのネーミング
- 5. JS出力 - console.logとinnerHTML
- 6. オペラのhtmlタグでinnerHTMLを変更しようとすると、htmlページの先頭にドロップされます
- 7. Toggle innerHTML
- 8. innerHTML unencodes
- 9. Javascript - innerHTMLを使用してhtmlを置き換えます。
- 10. jQueryオブジェクトhtml()は機能しません...しかしinnerHtmlは
- 11. Javascript innerHTML/jQuery .html()IE表示のバグ - divへのテーブルの追加
- 12. innerHTMLはHTML要素を永続的に追加しません
- 13. IE11 innerHTML strange behavior
- 14. REXML:javascript-DOMの.innerHTML =
- 15. Javascript parse innerhtml
- 16. innerHTML - Driving me Insane
- 17. innerHTMLの基礎
- 18. jQuery innerhtmlテーブル
- 19. IE innerHTMLエラー
- 20. 角2 - innerHTMLスタイリング
- 21. Smartyのjavascript innerHTML
- 22. Mozillaのjavascript innerHTML
- 23. javascript innerHTML問題
- 24. Not Working .innerHTML
- 25. CSSプロパティinnerHTMLの
- 26. innerhtmlできちんとした形で
- 27. jQueryのラップinnerHTMLの
- 28. Javascriptの配列innerHTML
- 29. HTMLAgilityPack解析InnerHTMLの
- 30. .innerHTML機能のJavascript
-ck ...ワックスのまったく違うボールである
.empty().append(value)
を呼び出しています「等しい? – qwertymkjsfiddleを作成できますか?一方、 'temp ['htmlTxt']'の値は? – Mikhail
あなたのhtmlも表示できますか? – helle