javascript - vue生成的dom有些奇怪,写的时候是嵌套,生成的时候是同级
PHPz
PHPz 2017-05-19 10:29:56
[JavaScript讨论组]

<body>
  <p id="app">
    <p class="con1" @click="click">
      vue
      <p class="con2"></p>
    </p>
  </p>
  <script>
    var vm = new Vue({
      el: '#app',
      mounted() {
        for (let i of this.$el.children) {
          console.log(i)
        }
      },
      methods: {
        click() {
          for (let i = 0; i < this.$el.children.length; i++) {
            console.log(this.$el.children[i])
          }
        }
      }
    })
  </script>
</body>

明明是嵌套,但生成后是同级

PHPz
PHPz

学习是最好的投资!

全部回复(1)
天蓬老师

这个跟 vue 没关系,是因为浏览器渲染的时候不允许 <p> 标签包含 <p> 标签,所以你自己看下,实际渲染生成了三个 <p> 标签。

抛开 vue 单独写一个

<p>1
    <p>2</p>
3</p>

你也会发现被浏览器渲染成了

<p>1</p>
<p>2</p>
"3"
<p></p>
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习
PHP中文网抖音号
发现有趣的

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号