Vue.js是一個流行的前端JS框架,它非常適合用于構建零散的UI組件。在Vue中獲取HTML頁面上的div元素非常簡單,只需要用到ref屬性即可。下面我們來看一下如何使用Vue.js獲取指定的div元素。
<template> <div ref="exampleDiv"> 這是一個示例div </div> </template> <script> export default { methods: { getDivId() { const divId = this.$refs.exampleDiv.getAttribute('id'); console.log(divId); } }, mounted() { this.getDivId(); } } </script>
上述代碼中,首先我們在template標簽中定義了一個div元素,并使用ref屬性設置了一個名稱叫做exampleDiv。在script標簽內,我們定義了一個getDivId方法,使用this.$refs.exampleDiv獲得對應的dom元素,并使用getAttribute方法獲取id屬性值。最后,在mounted鉤子函數中調用了getDivId方法,程序啟動后就可以打印出對應div元素的id值。
需要注意的是,如果沒有設置id屬性,getAttribute方法返回的是null。因此,在使用getAttribute方法時,需要注意判斷是否為空。獲取其他標簽及其屬性的方法與上述類似。
上一篇json報表需要換行么
下一篇ajax異步回調數據重復