innerHTML和outerHTML的区别

innerHTML和outerHTML的区别为什么要总结innerHTML和outerHTML的区别呢,主要是在看vue.js官方文档时,看到生命周期时)]原生的方法有点忘了,所以要重拾起来。示例如下:<!DOCTYPEhtml><htmllang=”en”><head><metacharset=”UTF-8″><metaname=”viewport”content=”width=device-width,initial-scale=1.0″>

大家好,又见面了,我是你们的朋友全栈君。

为什么要总结innerHTML和outerHTML的区别呢,主要是在看vue.js官方文档时,看到生命周期时
innerHTML和outerHTML的区别
原生的方法有点忘了,所以要重拾起来。

示例如下:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>outerHtml</title>
</head>
<body>
    <div id="app">
        <p>努力着</p>
        <p>从不放弃</p>
    </div>
    <script>
        const app = document.querySelector('#app');
        console.log(app.innerHTML); 
        // 会打印出 
        // <p>努力着</p>
        // <p>从不放弃</p>
        
        console.log(app.outerHTML);
        // 会打印出 
        // <div id="app">
        // <p>努力着</p>
        // <p>从不放弃</p>
        // </div>
    </script>
</body>
</html>

从上面的例子我们可以得出这样的方案

1.innerHTML 设置或获取位于对象内的HTML,不包括对象自己的标签

2.outerHTML设置或获取对象及其内容的HTML形式,包括对象自己的标签

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/148935.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • 在Ubuntu中安装pycharm社区版[通俗易懂]

    在Ubuntu中安装pycharm社区版[通俗易懂]版本Ubuntu20LTS

    2022年8月30日
    4
  • Jenkins(2)docker容器中安装python3[通俗易懂]

    Jenkins(2)docker容器中安装python3[通俗易懂]前言使用docker安装jenkins环境,jenkins构建的workspace目录默认是在容器里面构建的,如果我们想执行python3的代码,需进容器内部安装python3的环境。进jenki

    2022年7月28日
    29
  • 深度学习中Dropout原理解析「建议收藏」

    深度学习中Dropout原理解析「建议收藏」1.Dropout简介1.1Dropout出现的原因在机器学习的模型中,如果模型的参数太多,而训练样本又太少,训练出来的模型很容易产生过拟合的现象。在训练神经网络的时候经常会遇到过拟合的问题,过拟合具体表现在:模型在训练数据上损失函数较小,预测准确率较高;但是在测试数据上损失函数比较大,预测准确率较低。过拟合是很多机器学习的通病。如果模型过拟合,那么得到的模型几乎不能用。为了解决过拟合问题,一…

    2022年6月14日
    42
  • goland 207.3.3 激活码【2021最新】「建议收藏」

    (goland 207.3.3 激活码)JetBrains旗下有多款编译器工具(如:IntelliJ、WebStorm、PyCharm等)在各编程领域几乎都占据了垄断地位。建立在开源IntelliJ平台之上,过去15年以来,JetBrains一直在不断发展和完善这个平台。这个平台可以针对您的开发工作流进行微调并且能够提供…

    2022年3月27日
    101
  • mysql有casewhen函数吗_case when mysql

    mysql有casewhen函数吗_case when mysql本文主要向大家介绍了MySQL数据库之Mysqlcasewhen的三种用法,通过具体的内容向大家展现,希望对大家学习MySQL数据库有所帮助。<casewhen的三种用法:1.case字段when,字段的具体值。selecta.*,casenamewhen’流浪’then’法师’else’战士’endas’类型’FROMc_20170920a2.cas…

    2025年9月22日
    5
  • openEuler安装_Java源代码会被编译成

    openEuler安装_Java源代码会被编译成openEulerLinux源代码编译安装Nginx升级系统和软件yum-yupdate关闭防火墙systemctlstopfirewalldsystemctldisablefirewalld编辑/etc/selinux/config#SELINUX=enforcing修改为SELINUX=disabled#或者执行sed-i’s/SELINUX=enforcing/SELINUX=disabled/g’/etc/selinux/config保

    2022年9月28日
    4

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号