原生Js显示富文本效果demo(整理)

在这里插入图片描述

<!DOCTYPE html>
<html lang="zh">
	<head>
		<meta charset="UTF-8">
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<meta name="viewport" content="width=device-width, initial-scale=1.0">
		<title>原生Js显示富文本</title>
	</head>
	<body>
		<div id="message"></div>
	</body>
	<script>
		var text =
			'<div><img src="http://img.touxiangwu.com/2020/3/uq6Bja.jpg" alt=""><p style="font-size:12pt; line-height:115%; margin:0pt"><span style="font-family:宋体; font-size:12pt">富文本内容富文本内容富文本内容富文本内容富文本内容富文本内容。</span></p><p style="font-size:12pt; line-height:115%; margin:0pt"><span style="font-family:宋体; font-size:12pt">富文本内容富文本内容富文本内容。</span></p><p style="font-size:10.5pt; line-height:115%; margin:0pt 0pt 10pt; orphans:0; text-align:justify; widows:0"><span style="font-family:Calibri; font-size:10.5pt">&#xa0;</span></p></div><div class="cnzz" style="display: none;">\n'

		document.getElementById('message').insertAdjacentHTML("afterEnd", text)
	</script>
</html>

猜你喜欢

转载自blog.csdn.net/qq_38881495/article/details/126609592