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对象子树是,就有可能导致内存占用问题.假设某个元素有一个事件处理程序 ...
随机推荐
- 萝卜招聘网 http://www.it9s.com 可以发布免费下载简历求职 ,免费!免费!全部免费!找工作看过来 免费下载简历 !
萝卜招聘网 http://www.it9s.com 可以发布免费下载简历求职 ,免费!免费!全部免费!找工作看过来 免费下载简历 !萝卜招聘网 http://www.it9s.com 可以发布 ...
- java: Runtime和Process调用本机程序
java: Runtime和Process调用本机程序 调用纸牌程序,Process用来销毁程序 import java.io.IOException; public class RunTimeDem ...
- java.lang.ClassNotFoundException: org.springframework.web.filter.CharacterEncodingFilter
今天在用git merge 新代码后报了如下错误:java.lang.ClassNotFoundException: org.springframework.web.filter.CharacterE ...
- MongoDB 备份(mongodump)与恢复(mongorestore)
MongoDB数据备份 在Mongodb中我们使用mongodump命令来备份MongoDB数据.该命令可以导出所有数据到指定目录中. mongodump命令可以通过参数指定导出的数据量级转存的服务器 ...
- javascript中运算符的优先级
运算符优先级 JavaScript中的运算符优先级是一套规则.该规则在计算表达式时控制运算符执行的顺序.具有较高优先级的运算符先于较低优先级的运算符执行.例如,乘法的执行先于加法. 下表按从最高到最低 ...
- 即时聊天IM之一 XMPP协议简述
合肥程序员群:49313181. 合肥实名程序员群:128131462 (不愿透露姓名和信息者勿加入) Q Q:408365330 E-Mail:egojit@qq.com 综述: ...
- CSS换行文本溢出显示省略号
现代浏览器中使用css可以实现文本溢出,使用 text-overflow: ellipsis;在有些场景下没有效果,这个时候你需要检查应用的场景是是否是块元素,是否有确切的width. 如果是行内元素 ...
- 关于javascript闭包中的this对象
我们知道, this对象是运行时基于函数的执行环境绑定的:在全局函数中,this等于window,而当函数被作为某个对象的方法调用时,this等于那个对象.<Javascript高级程序设计&g ...
- sass2:
ass学习笔记2 今天介绍sass在重用代码时最具威力的两个功能.一个是嵌套(Nesting),一个混合(Mixin). 我们在写CSS通过需要多个后代选择器组合到一起才能定位到目标元素上,而这定义过 ...
- excel 两列比较内容是否相同
C1列输入 =IF(A1=B1,"","不同") 然后下拉以比较其他行