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. String 类上的常用操作

    java 中String 类上的常用操作: 首先创建对象  String line = new String("String demo"); String line2 = new ...

  2. es6语法

    let定义变量,特性: 1,不允许重复定义 2,不存在预解析 3,变量存在于会块级作用域 即{}内部 const : 定义常量,常量的值不能修改,若常量是对象 对象下的属性可修改. 解构赋值语法: 数 ...

  3. H3C SecPath 防火墙端口回流

    外网IP地址可以通过域名访问内外800端口网站,内网地址不可以,需要做回流 <<内网口.外网口都需要做nat映射>>定义ACL3001acl number 3001rule 0 ...

  4. A标签-一个按钮样式

    该文件引用jquery-1.11.3.js库 <!doctype html> <html> <head> <meta charset="UTF-8& ...

  5. Python语法点滴

    string: string.capitalize()  把字符串的第一个字符大写 string.startswith(obj)  string.endswith(obj) string.find(s ...

  6. intellij idea 12 搭建maven web项目

    原来公司一直使用eclipse,突然使用这个intellij还真有点不习惯,等用了一段时间才发现的确好用,因为也是刚开始用,所以很多不理解的地方,搭建一个项目从头好好了解下intellij 最开始的m ...

  7. 《Windows编程循序渐进》——进度条

    界面布局如下:

  8. 【Apache KafKa系列之一】KafKa安装部署

    kafka是一种高吞吐量的分布式发布订阅消息系统,她有如下特性: 通过O(1)的磁盘数据结构提供消息的持久化,这种结构对于即使数以TB的消息存储也能够保持长时间的稳定性能. 高吞吐量:即使是非常普通的 ...

  9. Node.js:包

    概要:本篇博客主要介绍了node.js中的包 包是在模块基础上更深一步的抽象,Node.js的包类似于C/C++的库函数或者Java/.Net的类库.它将某个独立的功能封装起来,用于发布.更新.依赖管 ...

  10. 关于input在li列表中居中显示

    input属于置换元素(replaced element),置换元素主要是指img,input,textarea,select,object等这类默认就有CSS格式化外表范围的元素,这些元素的垂直居中 ...