请帮忙看看这代码应该怎么写好?

[Lilacs]

最近用js写了个功能,原生的js,功能是实现了,还是一些没有完善,代码地址为https://github.com/Lilacs/JavaScriptCode/tree/master/cutPhoto
可以直接下载到本地用浏览器打开,两个文件,一个图片,一个页面.

我像把这个功能写成一个组件形式的,请问应该怎么写呢?

比如像这样就可以调用:

var hander = new Hander({
"aa": ...,
"bb": ...
});

hander.show();

请大家看看帮帮忙,谢谢了.

[sneezry]

var Hander = function(options) {
this.show = function() {...};
...
}

[Lilacs]

@sneezry。那些dom的初始化和css怎么处理较好呢？
不用额外的加载一个css文件，有什么好的处理方法吗？

[sneezry]

为什么要用js初始化dom和搞css呢？低耦合才是好设计啊

[jsonline]

不推荐用 JS 生产 HTML 和 CSS
非常不推荐

[Lilacs]

@sneezry 低耦合,我觉着我理解耦合的意思了,但是总感觉理解的不对.
你看,如果不放到一起,如果改,改的时候要该css和html和js中的代码,我要是都放到js中,写成配置的形式,不就是只需要改配置不就可以了吗?这不是低耦合吗?


@jsonline 那一般这种情况都是需要写三个地方吗?

[sneezry]

@Lilacs 低耦合的意思是改dom不影响js，改css不影响dom，就是说三者相对分立。推荐看看那本乌龟书，可维护的javascript。

[Lilacs]

@sneezry 前些天改了改,能帮帮提些建议吗? 多谢之前推荐的书,我是看了一部分书上的建议后改的.可能还不太完美.