Question

我正在努力获取html源代码值，并在单击按钮时将其放入特定的textarea或div中。但我不会得到整个HTML标签，结果开始标签是Meta标签，它将删除正确的HTML标签。我需要从<!DOCTYPE html

获取整个html源代码

这是我的演示

$('#save_editor').click(function(){
var full_value=$("#editor").html();
$('#write_html').val(full_value);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js"></script>
<div id="editor"> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"><html xmlns="http://www.w3.org/1999/xhtml"><head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>title</title> <style type="text/css"> // My style code </style> </head> </head> <body> <div>   <p>my body</p> </div> </body> </html> </div> <textarea id="write_html"></textarea> <button id="save_editor">save</button>

这里是我的工作区，带有示例图片： SAMPLE IMAGE 我需要更改div颜色并更改该div中的文本部分。如何使用HTML代码获取整个自定义div。我的演说FIDDLE。如何使用Javascript获取真正的源代码函数并放入特定的textarea。

Answer 1

第一个之后的任何html标记都将被删除。要解决此问题，只需将模板代码放在隐藏的textarea中，然后按字面意思保存该值。

更新小提琴：http://jsfiddle.net/j64r54rj/5/

＆＃13;

$('#save_editor').click(function(){
var full_value=$("#editor textarea").val();
$('#write_html').val(full_value);
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="editor"><textarea style="display: none;"><!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"><html xmlns="http://www.w3.org/1999/xhtml"><head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>title</title> <style type="text/css"> // My style code </style> </head> </head> <body> <div>   <p>my body</p> </div> </body> </html> </textarea> </div> <textarea id="write_html"></textarea> <button id="save_editor">save</button>

＆＃13;

Answer 2

我不确定JQuery html()是否会返回您想要的内容。但是通过简单的javascript和一些调整，你可以得到你期望的结果。

使用document.documentElement.outerHTML将获取除doctype之外的所有源代码。然后，您可以使用document.doctype获取文档类型并将它们拼凑在一起，您就可以获得完整的源代码。

如何使用JS获取完整的HTML标签并放入textarea

2 个答案: