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. Qt事件和事件循环

    在处理QT循环事件的时候遇到了问题,查了半天资料都没弄明白问题出在哪,后来找大牛同事问了一下,同事就给我写了QCoreApplication::processEvent()这个函数,好啦,终于搞定了, ...

  2. 浏览器标题栏添加小logo图片,记录一下,方便以后用

    效果如图:这是富连网的logo的实现,只需一行代码,我就写给自己和那些不知道的人吧 <link rel="icon" type="image/x-icon" ...

  3. LWP::UserAgent介绍3 -> cookie设置

    use LWP::UserAgent; use HTTP::Cookies; my $ua = LWP::UserAgent->new; $ua->cookie_jar(HTTP::Coo ...

  4. Go-利用Map实现类似Python的Set数据结构

    该笔记参考<Go并发编程实战> 首先实现一个自定义的HashSet 利用interface{}作为键,布尔型作为值. package main import ( "bytes&q ...

  5. Js的两种post方式

    第一种提交post的方式是传统方式,判断浏览器进行post请求. var xmlobj; //定义XMLHttpRequest对象 function CreateXMLHttpRequest() { ...

  6. css3 div垂直居中

    css3: #dd{ height: 300px; background: #0000cc; display: -webkit-box; display: flex; display: -webkit ...

  7. 第13天 JSTL标签、MVC设计模式、BeanUtils工具类

    第13天 JSTL标签.MVC设计模式.BeanUtils工具类 目录 1.    JSTL的核心标签库使用必须会使用    1 1.1.    c:if标签    1 1.2.    c:choos ...

  8. mysql分页

    1.查询第一行记录: select * from table limit 1 2.查询第n行到第m行记录 select * from table1 limit n-1,m-n; SELECT * FR ...

  9. JSP中的EL语言

    1,EL(Expression Language)是从JavaScript得到启发的一种表达式语言, 2,EL表达式包含文字,操作符,变量,函数调用: 3,EL 存取变量的语法格式:${ userna ...

  10. linux之sed命令

    原命令行: sudo sed -i 's/${storm.home}\/logs\/var\/log\/storm/g' /usr/share/storm/log4j/storm.log.proper ...