使用 jQuery 讀取 div 內容跳過 HTML、head 和 body 標簽

Question

我正在閱讀一個 HTML 模板並將其添加到 div（我已經設置了 runat='server'）后面的服務器端代碼。 這可以完美地在頁面上呈現和顯示 HTML。 現在我在客戶端更改呈現的 HTML 中的文本，並希望在服務器端讀取更新的文本（div 內的完整 HTML）以更新模板。 因此，我采用了一個隱藏字段，並在單擊“保存”按鈕時像這樣保存了 div 的更新 HTML。

$('#btnSaveTemplate').click(function () {
            $('#UpdatedEmailTemplate').val($('#divEmailBody').html());
});

HTML模板：

 <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title></title> </head> <body> <p> <strong><u>Database Decommission Notice – IMPORTANT NOTIFICATION</u></strong> </p> <p> <strong>FOLLOWING DATABASE(S) ARE SCHEDULED TO BE DECOMMISSIONED in 4 WEEKS from {SentDate};</strong> </p> <p> <strong>Why have you received this email?</strong> </p> <p> You are receiving this email as because you are an ITAO/ITAO delegate/CSM/CSM-1/key technical contact for database(s) that are scheduled to be decommissioned by 30. Below are the applications you have been identified. </p> </body> </html>

問題是當我嘗試在單擊保存的隱藏字段中保存更改的 html 時，它給了我如下內容。 （這是 $('#divEmailBody').html() 方法的輸出）

\n\n\n    <title></title>\n\n\n    <p>\n        <strong>\n            <img style=\"width: 744px; height: 141px;\" alt=\"\" src=\"http://nyccgdbb0004.us.db.com/images/emailImmediateActionRequired.png\" border=\"0\">\n        </strong>\n    </p>\n    <p>\n        <strong><u>Database Decommission Notice – IMPORTANT NOTIFICATION</u></strong>\n    </p>\n    <p align=\"center\" class=\"MsoNormal\" style=\"margin: 0in 0.5in 6pt 0in; text-align: center;\">\n        <b>\n            <i>\n                <u>\n                    <span lang=\"EN-GB\" style=\"color: rgb(192, 0, 0); font-size: 14pt;\">Do not ignore this message</span>\n                </u>\n            </i>\n        </b>\n    </p>\n    <p>\n        <strong>FOLLOWING DATABASE(S) ARE SCHEDULED TO BE DECOMMISSIONED in 4 WEEKS from 1/23/2017;</strong>\n    </p>\n   \n    <p>\n        <strong>Why have you received this email?</strong>\n    </p>\n    <p>\n        <a title=\"\" class=\"editableText editable editable-pre-wrapped editable-click editable-unsaved\" href=\"#\" data-original-title=\"\" data-title=\"Update Text\" data-type=\"textarea\">You are receiving this email as because you are an ITAO/ITAO delegate/CSM/CSM-1/key technical contact for database(s) that are scheduled to be decommissioned by 30. Below are the applications you have been identified.test</a>\n    </p>\n\n\n\n"

如何閱讀完整的 HTML？

Answer 1

如果它是模板，則不要將其添加到任何 html 元素，如 div .. 改用腳本標記。

<script id="UpdatedEmailTemplate" type="text/x-template">
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
</head>
<body>
    <p>
        <strong><u>Database Decommission Notice – IMPORTANT NOTIFICATION</u></strong>
    </p>
</body>
</html>
</script>

如果您將模板附加到 div，它不會保持原樣，瀏覽器會自行調整以使頁面成為有效的 html。 在一個頁面中你不能有兩個 html 標簽，所以瀏覽器會自動刪除另一個。 身體也一樣。 HTML 從不拋出錯誤，但它自己修復錯誤.. 有時修復與我們想要的不一樣。 這就是為什么它具有有效的 html 的原因

Answer 2

使用 JavaScript

var html = document.getElementsByTagName('html')[0];
var text = '<html>' + html.innerHTML + '</html/>';

使用jQuery：

var text = '<html>' + $('html').html() + '</html/>';

使用 jQuery 讀取 div 內容跳過 HTML、head 和 body 標簽

問題描述

2 個解決方案

解決方案1
1 2017-01-23 20:05:54

解決方案2
0 2017-01-23 20:05:32

使用 jQuery 讀取 div 內容跳過 HTML、head 和 body 標簽

問題描述

2 個解決方案

解決方案1 1 2017-01-23 20:05:54

解決方案2 0 2017-01-23 20:05:32

解決方案1
1 2017-01-23 20:05:54

解決方案2
0 2017-01-23 20:05:32