我原本一直以为innerHTML和jquery里的html其实是完全一样的,jquery是多此一举了,直到我遇到一次问题
 

看个示例:

复制代码 代码如下:
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。

今天在这个基础上加上了一个后加载广告的方法:

代码如下:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
<div id="logo_m"></div>
<script>
function doad(datastr,id){
//getid(id).innerHTML = datastr; 这个是原生js的写法
$("#"+id).html(datastr); //这个是jquery写法
}
/*
上面的都是直接的字符串写入,不能是js代码
下面的代码利用的是jquery的append加载google广告不错,百度的好像不能用。后加载百度的可以是用百度管家自带的函数。
*/
function doad2(datastr,id){
$("#"+id).append(datastr);
}
 
var logo_m='<a href="http://www.danhw.com/" target="_blank"><img src="http://files.jb51.net/image/kongbao_370.gif" width=370 height=60 /></a>';
doad(logo_m,'logo_m');
</script>

百度管家自带的后加载广告的代码,基于jquery

1
2
3
4
5
6
<div id="tonglanbd"></div>
<script type="text/javascript">
$.getScript("http://cbjs.baidu.com/js/m.js", function() {
BAIDU_CLB_fillSlotAsync("广告id,不能带u","tonglanbd");
});
</script>

innerHTML与jquery里的html()区别介绍的更多相关文章

  1. jquery.js和jquery.min.js的区别介绍

    1.区别:jquery官网提供2种jQuery的下载,一种是jquery.js另一种是jquery.min.js文件名不一定完全相同,但通常情况下:jquery.js是完整的未压缩的jQuery库,文 ...

  2. jQuery中attr()与prop()区别介绍

    .attr() : 获取匹配的元素集合中的第一个元素的属性的值 或 设置每一个匹配元素的一个或多个属性. •.attr( attributeName ) •.attr( attributeName ) ...

  3. jquery里prop和attr的区别

    本文通过具体的实例来讲述jquery里prop和attr的区别及使用方法. 在jquery里,我们要获取一个标签元素的属性,可以用attr或者prop,那么两者有什么区别呢? 其实很简单: attr可 ...

  4. javascript里面foreach遍历函数介绍,以及跟jquery里面each的区别

    foreach是把数组从头到尾遍历一遍,有三个参数分别是:数组元素,数组索引,数组本身.如果是一个参数,就是数组元素. var data=[1,2,3,4,5,6]; var sum=0; data. ...

  5. jquery和Js的区别和基础操作

    jqery的语法和js的语法一样,算是把js升级了一下,这两种语法可以一起使用,只不过是用jqery更加方便 一个页面想要使用jqery的话,先要引入一下jqery包,jqery包从网上下一个就可以, ...

  6. jquery和javascript的区别(常用方法比较)

    jquery 就对javascript的一个扩展,封装,就是让javascript更好用,更简单.人家怎么说的来着,jquery就是要用更少的代码,漂亮的完成更多的功能.JavaScript 与JQu ...

  7. jquery和javascript的区别

    jquery 就对javascript的一个扩展,封装,就是让javascript更好用,更简单,为了说明区别,下面与大家分享下JavaScript 与JQuery 常用方法比较 jquery 就对j ...

  8. JS对象与Dom对象与jQuery对象之间的区别

    前言 通过问题看本质: 举例: js的写法:document.getElementById('save').disabled=true; 在jquery中我是这样写的 $("#save&qu ...

  9. vue-d2admin-axios异步请求登录,先对比一下Jquery ajax, Axios, Fetch区别

    先说一下对比吧 Jquery ajax, Axios, Fetch区别之我见 引言 前端技术真是一个发展飞快的领域,我三年前入职的时候只有原生XHR和Jquery ajax,我们还曾被JQuery 1 ...

随机推荐

  1. Wrapper class webservice.jaxws.SayHi is not found. Have you run APT to generate them?

    最近在研究webservice,利用jdk来实现简单的webservice发布,但是运行时却发生了这样的异常,如下: Exception in thread "main" com. ...

  2. Apache 服务器认证 和重写

    htaccess文件是Apache服务器中的一个配置文件,它负责相关目录下的网页配置.通过htaccess文件,可以帮我们实现:网页301重定向.自定义404错误页面.改变文件扩展名.允许/阻止特定的 ...

  3. xxx/labelKeypoint/utils/qt.py:81: RuntimeWarning: invalid value encountered in double_scalars

    原代码: return np.linalg.norm(np.cross(p2 - p1, p1 - p3)) / np.linalg.norm(p2 - p1) 出现报错: xxx/labelKeyp ...

  4. 新手小白Linux(Centos6.5)部署java web项目(mysql5.7安装及相关操作)

    一.安装 参考:https://dev.mysql.com/doc/refman/5.7/en/linux-installation-yum-repo.html # 检测系统中是否安装了mysql y ...

  5. 转:window.orientation判断移动设备横屏竖屏

    通过window.orientation来判断设备横竖屏 function checkOrient() { if (window.orientation == 0 || window.orientat ...

  6. bug20170125

    1s定时请求接口,接口不响应(接口挂掉),浏览器崩溃

  7. (1)变量、常量、程序交互、数据类型、bool、基本运算符

    什么是变量 变量由变量名和变量值组成 name = 'Alex Li'  这个算式就是将一个值赋予给变量,也就是声明变量的意思 name 就是一个变量,也是一个变量的名字 'Alex Li' 就是一个 ...

  8. Pma模块详解,对用户登录linux等进行限制,密码修改限制等

    PAM详细介绍 2014-04-02 09:26:41 标签:PAM 原创作品,允许转载,转载时请务必以超链接形式标明文章 原始出处 .作者信息和本声明.否则将追究法律责任.http://lidefu ...

  9. hasura graphql-engine v1.0.0-alpha26 版本新功能试用

      hasura graphql-engine v1.0.0-alpha26 已经发布了,有好多新的变动,测试使用docker 环境,同时pg 数据库使用了citus citus 是一个方便扩展的pg ...

  10. window.open()与window.showModalDialog

    弹出窗口两种方式:    1.window.showModalDialog:      var feature = "dialogWidth:615px;dialogHeight:505px ...