提供了编程的基础技术教程

zl程序教程

您现在的位置是：首页 >  前端

当前栏目

前端基础 - JavaScript之innerHTML方法

JavaScript方法基础前端 innerHTML
2023-09-11 14:15:41 时间

innerHTML方法

需求：

需要把文本“小猪佩奇身上纹，掌声送给社会人”，由黑色变成红色，效果图如下：

在这里插入图片描述

变颜色后：
在这里插入图片描述

代码：

<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<script>
			window.onload = function() {
				var peiQiId = document.getElementById("peiqiId");
				peiQiId.innerHTML = "<font color='#FF0000'>" + peiQiId.innerText + "</font>";
			}
		</script>
	</head>

	<body>
		<div id="peiqiId">小猪佩奇身上纹，掌声送给社会人</div>
	</body>

</html>

使用 innerHTML 还可以使 innerHTML = “” 可以清除里面的样式。

相关文章