window.onload = function () {
            document.getElementById('btn1').onclick = function () {
            //显示的是层中的文本内容
                alert(document.getElementById('dv').innerText);
            };
            document.getElementById('btn2').onclick = function () {
            //显示的是层中标签和文本内容
                alert(document.getElementById('dv').innerHTML);
            };
            //=======================================
            document.getElementById('btn3').onclick = function () {
            //设置innerText--标签还是文本都都一起添加到层中了
                document.getElementById('dv').innerText = '<font color="yellow">设置的</font>';
            };
            document.getElementById('btn4').onclick = function () {
            //把效果显示到层中
                document.getElementById('dv').innerHTML = '<font color="yellow">舍得</font>';
            };
        };

<input type="button" name="name" value="显示innerText" id="btn1" />
    <input type="button" name="name" value="显示innerHTML" id="btn2" />
    <input type="button" name="name" value="设置innerText" id="btn3" />
    <input type="button" name="name" value="设置innerHTML" id="btn4" />

<div id="dv" style="width:600px; height:200px; border:1px solid red;">
        <span color="red" face="全新硬笔行书简" size="7">只要功夫深水棒磨成针!</span>
</div>

[原]innerText与innerHTML区别的更多相关文章

  1. JS-003-innerText 与 innerHTML 区别

    此文主要讲述在使用 innerText 和 innerHTML 获取元素中间值时的差别,我个人将二者的区别简单的理解为: webelement.innerText : 获取的是页面元素显示的文本 we ...

  2. innerText与innerHTML的区别

    innerText与innerHTML的区别:1.innerText将所有文本内容作为普通的文本2.innerHTML会识别文本内容中是否含有html标签,它能够把html标签的效果显示出来3.inn ...

  3. jQuery中的text()、html()和val()以及innerText、innerHTML和value

    *jQuery中设置或者获取所选内容的值:text();设置或者获取所选元素的文本内容: html();设置或者获取所选元素的内容(包括html标记): val();设置或者获取表单字段的值(前提是表 ...

  4. innerText和innerHTML

    起因 由于公司的项目以前不考虑浏览器的兼容性问题,当时只考虑ie8浏览器,封装的控件也只针对ie8,我后面的做的时候,也就针对ie8,最近发现,封装的日期控件,在firefox竟然没法显示出来,去看J ...

  5. jQuery中的text()、html()和val()以及javaScript中的innerText、innerHTML和value

    *jQuery中设置或者获取所选内容的值:text();设置或者获取所选元素的文本内容: html();设置或者获取所选元素的内容(包括html标记): val();设置或者获取表单字段的值(前提是表 ...

  6. Js之Dom学习-三种获取页面元素的方式、事件、innerText和innerHTML的异同

    一.三种获取页面元素的方式: getElementById:通过id来获取 <body> <input type="text" value="请输入一个 ...

  7. JavaScript DOM编程基础精华02(window对象的属性,事件中的this,动态创建DOM,innerText和innerHTML)

    window对象的属性1 window.location对象: window.location.href=‘’;//重新导航到新页面,可以取值,也可以赋值. window.location.reloa ...

  8. 从零开始学 Web 之 DOM(三)innerText与innerHTML、自定义属性

    大家好,这里是「 Daotin的梦呓 」从零开始学 Web 系列教程.此文首发于「 Daotin的梦呓 」公众号,欢迎大家订阅关注.在这里我会从 Web 前端零基础开始,一步步学习 Web 相关的知识 ...

  9. javascript总结37:DOM:innerText 和 innerHTML

    innerText 和 innerHTML 作用: 给双标签的元素设置内容/获取双标签里面的内容 不同点: innerText 只是用于获取文本或设置文本 innerHTML 不仅可以用于设置/获取文 ...

随机推荐

  1. jsp中,对window对象的简单总结

    window的对象有: alert(message) 弹出一个警示对话框confirm(message) 弹出一个确认对话框prompt(message,defaultmessage) 弹出一个提示对 ...

  2. centos 设置删除提示

    centos 设置删除.覆盖提示 相信好多用linux的同学都用过cp这个命令来覆盖文件,但是新建的普通用户不会有任何提示,这时候心里就咯噔一下,赶紧看看新文件的是不是传上去了.如果加上提示,是不是就 ...

  3. mx51的三个framebuffer,mxc_ipuv3_fb.c分析

    转载:http://blog.csdn.net/jack_a8/article/details/43309169 mx51支持三个framebuffer:fb0, fb1, fb2 /dev/grap ...

  4. jq小demo—图片翻页展示效果 animate()动画

    <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...

  5. .net中读取xml文件中节点的所有属性信息

    功能描述: 将数据以xml的格式记录成配置文件,需要获取配置文件中的数据时,则获取对应的配置文件,读取配置文件里对应节点的所有属性. 逻辑实现: 1.将数据配置好在xml文件中. 2.获取xml文件中 ...

  6. SQL多表插入事务处理

    新建两个需统一事务处理的数据表 --学生信息表 CREATE TABLE [dbo].[Student]( [Id] [int] NOT NULL, ) NOT NULL, [Age] [int] N ...

  7. Strusts2--课程笔记8

    文件的和上传和下载: (1)文件的上传: Struts是通过拦截器实现文件上传的,而默认拦截器栈中包含了文件上传拦截器,故表单通过Struts2可直接将文件上传,其底层是通过apache的common ...

  8. (一)html之基本结构

    一:HTML基本结构 1.1 HTML文档结构 1.1.1 外层结构 <!DOCTYPE HTML> <html> </html> DOCTYPE元素用于告诉浏览器 ...

  9. 关于STM32的IO口速率问题

    输入模式可以不用配置速度,但是输出模式必须确定最大输出频率.当STM32的GPIO端口设置为输出模式时,有三种速度可以选择:2MHz.10MHz和50MHz,这个速度是指I/O口驱动电路的速度,是用来 ...

  10. hdu 1384 Intervals

    差分约束系统. 求最小值,用最长路来解决. #include<cstdio> #include<cstring> #include<cmath> #include& ...