innerHTML属性
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>document.getElementById</title>
</head>
<body>
<p id="con">您好!</p>
<script type="text/javascript">
var mychar=document.getElementById("con");
document.write("结果:"+mychar); //输出获取的P标签。
</script>
</body>
</html>
结果是:
如果改为:var mychar=document.getElementById("con").innerHTML;
结果就是:
原因是:前者获取到的是整个对象,后者是获取到其中的内容
---------------------------------------------------------------------------------------------------------------------------------
由比如,将代码改为如下顺序
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>document.getElementById</title>
<script type="text/javascript">
var mychar=document.getElementById("con").innerHTML;
document.write("结果:"+mychar); //输出获取的P标签。
</script>
</head>
<body>
<p id="con">您好!</p>
</body>
</html>
结果就是:null
原因是:代码是顺序执行的,先调用了JavaScript代码,但是这个时候还没有ID为“con”的元素,得到空
----------------------------------------------------------------------------------------------------------------------
innerHTML属性用于获取或替换HTML元素的内容。语法为:object.innerHTML (注意:区分大小写)
示例:
<html>
<head>.....</head>
<body>
<h2 id="con">原始标题</H2>
<script type="text/javascript">
var mychar=document.getElementById("con"); ;
document.write("原标题:"+mychar.innerHTML+"<br>");
mychar.innerHTML="Hello World!"
document.write("修改后的标题:"+mychar.innerHTML);
</script>
</body>
</html>
结果:原标题:原始标题
修改后的标题:Hello World!
innerHTML属性的更多相关文章
- 标签的innerHTML属性和html()
在新公司开发编码的时候,经常写js代码:有时候就需要往某个标签里添加一些html脚本或者要拿到某个标签里的html脚本,那么就会用到innerHTML和html. 1.innerHTML属性 w3sc ...
- HTML DOM innerHTML 属性及实现图片连续播放
定义和用法 innerHTML 属性设置或返回表格行的开始和结束标签之间的 HTML. 语法 tablerowObject.innerHTML=HTML 实例 下面的例子返回了表格行的 inner H ...
- JavaScript Dom基础-9-Dom查找方法; 设置DOM元素的样式; innerHTML属性的应用; className属性的应用; DOM元素上添加删除获取属性;
JavaScript Dom基础 学习目标 1.掌握基本的Dom查找方法 domcument.getElementById() Domcument.getElementBy TagName() 2.掌 ...
- innerHTML属性,outerHTML属性,textContent属性,innerText属性区别详解
innerHTML属性用来读取或设置某个节点内的HTML代码. outerHTML属性用来读取或设置HTML代码时,会把节点本身包括在内. textContent属性用来读取或设置节点包含的文本内容. ...
- InnerHTML属性的XSS利用
来自:http://www.myhack58.com/Article/html/3/7/2011/32395.htm innerHTML 是个奇怪的HTML属性,不是W3C标准支持的,但几乎所有的厂商 ...
- 火狐不支持innerText属性,只支持innerHTML属性
做的一个js的小程序放到火狐上用不了了,原因是innerText不是标准属性,换成innerHTML属性就好,但是可能需要把html标签给去掉
- innerHTML 属性用于获取或替换 HTML 元素的内容。
innerHTML 属性 innerHTML 属性用于获取或替换 HTML 元素的内容. 语法: Object.innerHTML 注意: 1.Object是获取的元素对象,如通过document.g ...
- 使用innerHTML属性向head中插入字符时报“无法设置 innerHTML 属性。 该操作的目标元件无效”的错误
向head中动态插入script文件,代码如下: var sc = document.createElement("script"); sc.src = "//www.c ...
- innerHTML属性的内存和性能问题
使用innerHTML替换子节点可能会导致浏览器的内存占用问题,尤其是在IE中,问题更加明显.在删除带有时间处理程序或引用了其他js对象子树是,就有可能导致内存占用问题.假设某个元素有一个事件处理程序 ...
随机推荐
- 转!!负载均衡器技术Nginx和F5的优缺点对比
对于数据流量过大的网络中,往往单一设备无法承担,需要多台设备进行数据分流,而负载均衡器就是用来将数据分流到多台设备的一个转发器. 目前有许多不同的负载均衡技术用以满足不同的应用需求,如软/硬件负载均衡 ...
- js 数组赋值问题 :值传递还是引用?
转载于知乎var a = [1,2,3]; var b = a; a = [4,5,6]; alert(b); //[1,2,3] 面试时被问到这样一个问题,竟然从来没试过... 当时直接的理解,数组 ...
- Name jdbc is not bound in this Context
简介 今天接手中行一个交通罚款web工程时,从svn同步下来后,,启动竟然报找不到数据源错误,本来以为很简单解决找了两个小时,现在记录下来. Exception: Name jdbc is not b ...
- meta 360极速模式
<meta name="render" content="webkit"> 启用360极速模式
- JavaScript查找数组是否存在指定元素
利用JavaScript的函数有两种方式 1.jQuery jQuery.inArray( value, array [, fromIndex ] ) value 类型: Anything 要查找的值 ...
- request和session作用域的意义
1.简单说 page指当前页面.在一个jsp页面里有效 ,page里的变量没法从index.jsp传递到test.jsp.只要页面跳转了,它们就不见了.2.request 指从http请求到服务器处理 ...
- 关闭显示器API及命令
window下命令powercfg /change "Home/Office Desk" /moniter-timeout-ac 1C#中实现[DllImportAttribute ...
- 两个div叠加触发事件发生闪烁问题
今天遇到一个问题,想实现一个功能: 当鼠标移到div1上的时候,会出现div2.出现时div2在div1的上面,div2在出现后发生闪烁的问题. 于是开始找问题根源,发现原来是因为当我们触发div1的 ...
- guava学习--monitor
转载:https://my.oschina.net/realfighter/blog/349924 https://my.oschina.net/realfighter/blog/349926 M ...
- maven私服搭建(centOS6.5)
maven的好处和私服的应用本文不赘述,私服搭建如下: MAVEN 私服搭建(centOS 6.5 环境) 1. 准备环境,搭建centOS6.5系统环境,略 2. 准备对应的软件包如下: A. ...