innerHTML与jquery里的html()区别介绍

内容为转载
原文链接：http://www.jb51.net/article/31548.htm
这篇帖子写的很好我在将json数据发送到前台，然后将数据镶嵌到table表格里出现了问题，开始用的是innerHTML,数据不能在页面显示，但是console.log(data)可以，后来改用html(),数据可以正常显示。
以下播客为原文内容：
原文链接：http://www.jb51.net/article/31548.htm

var tbody=document.createElement('tbody'); 
tbody.innerHTML='<tr><td>IE下tbody的innerHTML是只读的</td></tr>'; //在IE下报错，目标对象错误 

现在用jquery的html试试， 
代码如下:
$(tbody).html('<tr><td>IE下tbody的innerHTML是只读的</td></tr>');

发现IE下用jquery能正确显示了，没任何问题。
后来查阅资料才知道，原来IE下tbody、tr这些的innerHTML都是只读的，不允许写入，而在其他浏览器下则没问题。

而jquery里是用了try，catch来检测，如果报错则在catch里重新调用this.empty().append(value)，是通过append来添加字符串的。

jquery 如何使用innerHTML

$("#responsediv") 是个Jquery对象，它Val()是对Value属性赋值对它无意义，Jquery没有innerHTML这个属性，应该这样写$(“#responsediv”)[0].innerHTML=msg 就可以获得这个Dom对象使用innerHTML。

今天将json数据从后台，循环到html页面的table表格里，开始用innerHTML不能显示，改为html(data),正常显示
html代码：

页面

<div>
    <table>
        <tr>
            <td>用户id</td>
            <td>用户姓名</td>
            <td>用户地址</td>
        </tr>
        <tbody id="tbody-result"></tbody>
    </table>
</div>

异步请求：

 $.ajax({
           type:"get",
           url:"/mavenweb/customer/hts.do",
           dataType:"json",
           success:function (data) {
               alert(data);
               var str = "";
               $.each(data,function (i,obj) {
                    str += "<tr>" +
                            "<td>"+obj.cust_id+"</td>"+
                            "<td>"+obj.cust_name+"</td>"+
                            "<td>"+obj.cust_address+"</td>"+
                            "</tr>"
               })
           $("#tbody-result").html(str)

           }
       });

controller代码

// 点击按钮循环显示出所有数据到html页面
    @RequestMapping("/customer/hts")
    @ResponseBody
    public List<Customer> htms(){
        List<Customer> customerList = customerService.getCustomerList();
        System.out.println(customerList);
        return customerList;
    }