Vue.js DOM操作

2020-03-29 22:20:21 1081

<template>
     <input type="button" @click="reply($event)" value="回复">
</template>

	export default {
         methods: {
         	 replyFun(e) {
             	// e.target 是当前点击的元素
				// e.currentTarget 是绑定事件的元素
 			//获得点击元素的前一个元素
  			e.currentTarget.previousElementSibling
 			//获得点击元素的第一个子元素
 			e.currentTarget.firstElementChild
 			// 获得点击元素的下一个元素
                e.currentTarget.nextElementSibling
                // 获得点击元素中id为test的元素
                e.currentTarget.getElementById("test")
                // 获得点击元素的test属性
                e.currentTarget.getAttributeNode('test')
                // 获得点击元素的父级元素
                e.currentTarget.parentElement
                // 获得点击元素的前一个元素的第一个子元素的HTML值
                e.currentTarget.previousElementSibling.firstElementChild.innerHTML
             }
         }
    }

• js
• vue.js
• html