zoukankan      html  css  js  c++  java
  • innerText和innerHTML区别

    innerText和innerHTML区别 

    一、简介

    innerText属性将文本内容设置或返回为指定节点及其所有子节点的纯文本,而innerHTML属性将获取和设置元素中的纯文本或HTML内容。与InnerText不同,InnerHTML允许您使用HTML格式的文本,并且不会自动对文本进行编码和解码。

    二、代码案例

    主要代码段:

    <body>
        <div id="test">这是一段包含一些
            <h5>代码</h5><italic>文本</italic></div>
        <!-- 输出带标签内容的文本 -->
        <button onClick="innerTextFn()">innerHTML</button>
        <!-- 编译过的标签文本 -->
        <button onClick="innerHTMLFn()">innerText</button>
    
        <script>
            function innerTextFn() {
                var x = document.getElementById('test');
                alert(x.innerText);
            }
    
            function innerHTMLFn() {
                var x = document.getElementById('test');
                alert(x.innerHTML);
            }
        </script>
    </body>

    三、运行结果

    innerText属性将文本内容设置或返回为指定节点及其所有子节点的纯文本,而innerHTML属性将获取和设置元素中的纯文本或HTML内容。与InnerText不同,InnerHTML允许您使用HTML格式的文本,并且不会自动对文本进行编码和解码。


    技术的发展日新月异,随着时间推移,无法保证本博客所有内容的正确性。如有误导,请大家见谅,欢迎评论区指正!
    我创建了一个.NET开发交流群,用于分享学习心得和讨论相关技术难题。欢迎有兴趣的小伙伴扫码入群,相互学习!

  • 相关阅读:
    多线程交替打印示例
    单列集合框架体系Collection
    同域名下,两个网站通过cookie共享登录注册功能大概思路。
    CSS 隐藏滚动条
    Vue3--组件间传值
    TypeScript--类(class)
    TypeScript--泛型(generic)
    理解LDAP与LDAP注入
    CRLF injection 简单总结
    pigctf期末测评
  • 原文地址:https://www.cnblogs.com/wml-it/p/15410726.html
Copyright © 2011-2022 走看看