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对象子树是,就有可能导致内存占用问题.假设某个元素有一个事件处理程序 ...
随机推荐
- 转：OSGi 入门篇：生命周期层
OSGi 入门篇:生命周期层 前言 生命周期层在OSGi框架中属于模块层上面的一层,它的运作是建立在模块层的功能之上的.生命周期层一个主要的功能就是让你能够从外部管理应用或者建立能够自我管理的应用(或 ...
- 大数据运算模型 MapReduce 原理
大数据运算模型 MapReduce 原理 2016-01-24 杜亦舒 MapReduce 是一个大数据集合的并行运算模型,由google提出,现在流行的hadoop中也使用了MapReduce作为计 ...
- ADO.NET 访问数据库
对数据库的访问时各种数据库应用程序开发的核心技术,.NET框架中提出的ADO.NET技术为应用程序的开发提供了一致的接口,增强了程序的可移植性和可扩展性. a:使用链接对象Connection连接数据 ...
- 4.AE中的缩放，书签
1.书签 private void textBox1_TextChanged(object sender, EventArgs e) { if (txtBookmark.Text == "& ...
- 编写自定义Yeoman生成器
转载自JSCON-简时空:<自定义Yeoman生成器> 1.Getting Started 1.1.设置Node模块 Yeoman提供了generator-generator方便快速编写自 ...
- Flatten Binary Tree to Linked List [LeetCode]
Given a binary tree, flatten it to a linked list in-place. For example,Given 1 / \ 2 5 / \ \ 3 4 6 T ...
- 在update时用触发器插入数据
CREATE trigger [dbo].[Debt_Insert] on [dbo].[Debt] for insert as declare @tmpOrderID1 varchar(30)sel ...
- win7优化
- ElasticSearch配置说明
配置文件位于%ES_HOME%/config/elasticsearch.yml文件中. cluster.name: elasticsearch 配置集群名称,默认elasticsearch node ...
- java selenium (十三) 智能等待页面加载完成
我们经常会碰到用selenium操作页面上某个元素的时候, 需要等待页面加载完成后, 才能操作. 否则页面上的元素不存在,会抛出异常. 或者碰到AJAX异步加载,我们需要等待元素加载完成后, 才能操 ...