堆栈的深层次理解

最新推荐文章于 2022-12-07 09:42:34 发布

北辰浅巷墨漓

最新推荐文章于 2022-12-07 09:42:34 发布

阅读量186

点赞数

分类专栏：前端文章标签： css 堆栈栈内存

本文链接：https://blog.csdn.net/qq_36655511/article/details/103061225

版权

前端专栏收录该内容

58 篇文章 1 订阅

订阅专栏

下面写了三种颜色来改变div的颜色，前面两种可以改变，第三种却不可以改变，是什么原因呢？

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>堆栈内存的深度理解</title>
    <style>
        .box{
            width:100px;
            height: 100px;
            background-color: lightblue;
        }
    </style>
</head>
<body>
    <div class="box" id="box"></div>
</body>
<script>
    let box=document.getElementById('box');
    //方式一
    // box.style.backgroundColor='red'; //可以改变颜色
    // 方式二
    // let s=box.style;
    // s.backgroundColor='green';  //可以改变颜色
    //方式三
    let c=box.style.backgroundColor;  //不可以改变颜色
    c='red';
</script>
</html>

如果要获得box的详细信息可以用console.dir(box)；
在这里插入图片描述
从图片中可以看出，它是一个引用类型（object），由许多组键值对组成，而且我们找到style这个属性，可以看出，它本身又是一个引用类型，所以出现上面这种情况，归根结底，还是与栈内存有关。

在这里插入图片描述

北辰浅巷墨漓

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
堆栈的深层次理解

下面写了三种颜色来改变div的颜色，前面两种可以改变，第三种却不可以改变，是什么原因呢？<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>堆栈内存的深度理解</title> <style> ...
复制链接

扫一扫

专栏目录