jquery 写组件

jQuery是目前最热门的JavaScript框架之一，它可以为网页提供丰富的交互效果，例如：动画效果、特效、交互式表单等。在jQuery的基础上，我们可以轻松地编写自己的组件。

$.(document).ready(function(){
    $.fn.demo = function(options){
        //默认参数
        var defaults = {
            'width': '100px',
            'height': '100px',
            'background': 'red'
};
        //选项
        var opts = $.extend(defaults, options);

        return this.each(function(){
            $(this).css({
                'width': opts.width,
                'height': opts.height,
                'background': opts.background
            });
});
    };

    $('#box1').demo({
        'background': 'green'
    });

    $('#box2').demo({
        'width': '200px',
        'height': '200px'
    });
});

上面的代码演示了如何使用jQuery来创建自己的组件。在这个例子中，我们定义了一个名为"demo"的组件，使用$.fn来扩展jQuery并在选项中定义了一些默认值。在执行每个$(this)之后，我们简单地使用css()函数来设置元素的样式。

当我们实例化我们的组件时，我们可以传递选项来控制元素的外观。例如，我们可以使用不同的背景颜色、宽度和高度来创建不同的元素。第一个例子中，我们使用了绿色的背景，而第二个则使用了更大的大小。

总之，jQuery是一个非常强大的JavaScript框架，在我们的网站上使用它可以提供非常强大和丰富的用户体验。通过编写自己的组件，我们可以为我们的网站创建特定于用例的功能，不必在每个网站上重新编写相同的代码。