样式相关操作

最新推荐文章于 2023-05-11 17:40:11 发布

木槿晞

最新推荐文章于 2023-05-11 17:40:11 发布

阅读量178

点赞数

分类专栏：课程文章标签： js

本文链接：https://blog.csdn.net/xyw_jzj5201314/article/details/109633786

版权

课程专栏收录该内容

21 篇文章 0 订阅

订阅专栏

样式相关操作

<!DOCTYPE html>
<html lang="zh-CN">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<button>点击</button>
<div class="box"></div>
</body>
<script>
    // 获取
    var btn = document.querySelector("button");
    var div = document.querySelector("div");
    // 给按钮注册单击事件  修改样式在style里面
    btn.onclick = function() {
        div.style.width = "100px";
        div.style.height = "100px";
        div.style.backgroundColor = "pink";
        // 给元素设置内容 区别：innerHTML 会解析标签  innerText不会解析标签原样输出
        // div.innerHTML="<h2>123456</h2>"
        div.className = "box1 yang";
        div.innerText = "<h2>123456</h2>"
    }
</script>

</html>

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

木槿晞

关注关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
样式相关操作

样式相关操作<!DOCTYPE html><html lang="zh-CN"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title></head><button>点击&l
复制链接

扫一扫