with简单说明

最新推荐文章于 2024-07-16 16:43:05 发布

web修理工

最新推荐文章于 2024-07-16 16:43:05 发布

阅读量79

点赞数

分类专栏： JavaScript 文章标签： javascript 前端 css3

本文链接：https://blog.csdn.net/qq_42374676/article/details/121167048

版权

JavaScript 专栏收录该内容

163 篇文章 2 订阅

订阅专栏


<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>16-with简单说明</title>
    <style>
        * {
            margin: 0;
            padding: 0;
        }
    </style>
</head>
<body>

<div id="demo">我是一个div</div>
with:可以把对象的作用域引申到大括号中,减少代码量

场合:当需要深层次的引用

使用注意点:
    1.不能使用无前缀的方式添加属性
    2.this指向 window
    3.严格模式禁止使用

使用建议:
    不建议使用

<script>
    var obj = {
        name : 'zs',
        age : 20,
        des : 'des'
    }

//    obj.name = 'ls';
//    obj.age = 21;
//    obj.des = '111';
//    console.log(obj);

    with(obj){
        name = 'ls';
        age = 21;
        des = '22';
//        obj.log = 'log';
//        console.log(this);
    }
//    console.log(obj);
</script>
<script>
    var div = document.getElementById('demo');
//    div.style.width = '200px';
//    div.style.height = '300px';
//    div.style.background = 'red';

//    with(div.style){
//        width = '200px';
//        height = '300px';
//        background = 'blue';
//    }

    // 即时函数替代
    (function (t) {
        t.width = '200px';
        t.height = '300px';
        t.background = 'red';
    })(div.style);

</script>
</body>
</html>

web修理工

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
打赏
0
评论
with简单说明

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>16-with简单说明</title> <style> * { margin: 0; padding: 0; } </style></head>&.
复制链接

扫一扫