025--Hbuilder--js--操作节点样式

最新推荐文章于 2024-02-27 18:35:18 发布

做梦吃星星

最新推荐文章于 2024-02-27 18:35:18 发布

阅读量202

点赞数

分类专栏： JavaScript 文章标签： 1024程序员节 js javascript

本文链接：https://blog.csdn.net/weixin_45515187/article/details/109261227

版权

JavaScript 专栏收录该内容

39 篇文章 1 订阅

订阅专栏

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<link rel="shortcut icon" href="//www.baidu.com/favicon.ico" type="image/x-icon"/>
	</head>
	<body>
		<p id="haha1" style="width: 300px;height: 100px;color: blue;background-color:chocolate ;">我是一个新手</p>
	</body>
</html>
<script type="text/javascript">
	/*修改节点样式第一步，还是获取节点*/
	var ha = document.getElementById("haha1");
	/*打印节点样式*/
	console.log(ha.style.width);
	console.log(ha.style.height);
	console.log(ha.style.color);
	/*获取和修改节点样式的时候，样式中间带"-"的，
	 * "-"省略，后一个单词首个字母变大写*/
	console.log(ha.style.backgroundColor);
	/*修改节点样式*/
	ha.style.width = "200px";
	ha.style.height = "200px";
	ha.style.color = "#FF0000";
	ha.style.backgroundColor = "aqua";
	/*打印节点样式*/
	console.log(ha.style.width);
	console.log(ha.style.height);
	console.log(ha.style.color);
	console.log(ha.style.backgroundColor);
</script>

做梦吃星星

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
025--Hbuilder--js--操作节点样式

<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <link rel="shortcut icon" href="//www.baidu.com/favicon.ico" type="image/x-icon"/> </head> <body> <p id="haha1" style="
复制链接

扫一扫