DB-hub Technology Vue Vue中获取dom元素

Vue中获取dom元素

方法一:
给元素绑定ref=“XXX” 属性,
然后this.$refs.XXX或者this.refs[‘XXX’]来获取dom元素。

<template>
  <section>
    <div ref="hello">
      <h1>Hello World ~</h1>
    </div>
    <el-button type="danger" @click="get">点击</el-button>
  </section>
</template>
<script>
  export default {
    methods: {
      get() {
        console.log(this.refs['hello']);
        console.log(this.refs.hello);
      }
    }
  }
</script>

方法二:
直接给相应的元素加id,然后再document.getElementById(“id”);获取

<div id="test">
    <p>This is a test message</p>
</div>

document.querySelector('#test').innerHTML='message had been changed';

或者:
document.getElementById("test").innerHTML='message had been changed';

Leave a Reply

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

Related Post