JQuery 获取DOM初始化 ECharts

刚开始用ECharts，看了百度的例子，是使用原生的方法获取div，然后再初始化Chart组件:

var myChart = echarts.init(document.getElementById('main'));

尝试用JQuery获取DIV设置后，发现图直接消失了，后来用Chrome浏览器debug代码，发现document.getElementById 跟 $('#id') 返回的结果不一样。

然后用下面方式试了下，就可以了：

var myChart = echarts.init($('#main')[0]);
// 或者
var myChart = echarts.init($('#main').get(0));

平时一直使用这种方式来获取DOM元素，想当然的认为JQuery返回的就是DOM元素了，通过这次调试，发现其实并不是....

通过调试发现JQuery一直是返回数组的，即使未获取到DOM，也返回一个空数组。

JQuery 这么实现有这么几个好处，个人理解：

• 返回一个JQuery对象，而不是DOM对象，主要是为了能够提供更多的方法，如val()、text()、html()等，提供丰富的操作方法
• 获取的DOM元素是一个数组，这应该是因为获取的DOM元素个数不定，这样使用者可以不用考虑里面元素的个数，直接操作即可，内部实现也统一了。
• 可以使用链式操作
• 一般使用JQuery之后，很少情况再拿到DOM元素去做一些操作，而且操作起来并不比JQuery方便。真有需求，加个[0]即可。