js控制div宽度的自动生成

在做项目的时候遇到了一个需求，要求一个div的宽度随着浏览器可是区域大小来自动改变，差了很多文档，因为是新手所以一直没有解决，现在完成了这个功能，特地来写下心得。

• 可使用js的方法：

  • function EchartChange(){
//自动获取浏览器宽度，和img宽度，然后得出EChart的宽度。
debugger;
var clientWidth = $(window).width() || document.body.clientWidth;//clientWidth 为浏览器的宽度
var clientHeight = $(window).height() || document.body.clientHeight;//clientHeight 为浏览器的高度
var imgWidth = document.getElementById("div_topleft").offsetWidth;//获取一个imgWidth 的div的宽度，我的这个div宽度是固定的。
var topright = document.getElementById("div_topright");//topright 是你需要根据浏览器窗口大小改变宽度的那个div
topright.style.width=(clientWidth-imgWidth)+"px";//给topright 赋值，即总宽度-部分div宽度
echartWidth.style.width=(clientWidth-imgWidth-30)+"px";//这个是topright 的div中的某个div,可要可不要。
}
    这里需要注意，每个人的情况不同，所以需要根据需求有所改变，我的是左侧div宽度固定，右侧div需要随窗口大小而改改变宽度。同理高度也是如此。

  此时你只是完成了对宽度设置的一个方法，你还需要添加一个事件，一个浏览器窗口改变即可触发的事件，我用的resize.应该还有其他的方法，可以多试试。我这里的代码是：
$(window).resize(function() {
EchartChange();
myChart1.resize();
});
  其中的myChart是其他的一个div；

• 还有一种方法是jquery这里就不说明了，因为俺还没遇到。。

有帮助请采纳，谢谢。