一个面向对象的JS例子，很好的支持了开闭原则(不要重复你昨天的代码）

最新推荐文章于 2024-11-23 11:16:48 发布

转载最新推荐文章于 2024-11-23 11:16:48 发布 · 2.2k 阅读

asp.net 专栏收录该内容

90 篇文章

订阅专栏

本文介绍了一个使用JavaScript实现的面向对象编程示例。该示例通过定义一个名为HtmlControl的方法来创建一个HTML元素，并设置了该元素的宽度、高度、位置及背景颜色等属性。


<script type="text/javascript">

    //一个面向对象的JS例子，很好的支持了开闭原则

    function HtmlControl(options) {//定义一个方法

        var el = options.element;

        el.style.width = options.width;

        el.style.height = options.height;

        el.style.top = options.top;

        el.style.background = options.background;

    }

 

    var option = { //为方法定义一个参数对象

        element: document.getElementById('test'),

        left: 50,

        top: 0,

        width: 100,

        height: 200,

        background: '#f00'

    }

    option.background = '#ff0'; //对参数对象进行扩展

 

    HtmlControl(option); //调用

</script>