为什么我使用JQuery只获得文本而不是HTML？

Question

我有一个H1标签&我想HTML（）单击按钮时显示此元素，但现在只显示文本而不是HTML。如何获得正确的HTML？

我的代码：-

$（函数（）{$（'按钮'）.点击（函数（）{警报（$（'h1'）.html（））；});});

<script src=“https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js“></script>标题1</h1><button>单击</button>

Answer 1

你应该使用外部HTML:

这个外部HTMLElement DOM接口的属性获取描述元素及其后代的序列化HTML片段。也可以将其设置为用从给定字符串解析的节点替换元素。

$（函数（）{$（'按钮'）.点击（函数（）{警报（$（'h1'）.get（0）.outerHTML）；});});

<script src=“https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js“></script>标题1</h1><button>单击</button>

Answer 2

外部HTML在javascript中

$（函数（）{$（“按钮”）.click（函数）{警报（document.querySelector（“h1”）.outerHTML）；});});

<script src=“https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js“></script>标题1</h1><button>单击</button>

Answer 3

这个.html（）函数返回元素的内部html，以获取外部HTML对于任何给定的元素，尝试将其包装在容器中，然后使用.html（）.

$（函数（）{$（'按钮'）.点击（函数（）{var elHTML=$（'<div></div>'）.append（$（'h1'））；警报（elHTML.html（））；});});