原生js通过最外层id获取下面指定的子元素
2024-08-24 04:50:23
需求:在vue中使用v-for循环出来的元素,设置动态id,之后获取下面的所有textarea标签
template:
<table cellpadding = 2 v-for="(item, index) in arrData" :key="index" cellspacing = 0 :id="'table' + index">
<thead>
<tr>
<th>本周计划</th>
<th>本周实际完成</th>
<th>开累情况</th>
<th>计划完成情况分析</th>
<th>存在的问题</th>
<th>下周计划</th>
</tr>
</thead>
<tbody>
<tr>
<td>
<textarea type="text" readonly='readonly' v-model="item.curWeekly.curweekplan"></textarea>
</td>
<td>
<textarea type="text" readonly='readonly' v-model="item.curWeekly.actual_final" ></textarea>
</td>
<td>
<textarea type="text" readonly='readonly' v-model="item.curWeekly.condition" ></textarea>
</td>
<td>
<textarea type="text" readonly='readonly' v-model="item.curWeekly.analysis" ></textarea>
</td>
<td>
<textarea type="text" readonly='readonly' v-model="item.curWeekly.problem" ></textarea>
</td>
<td>
<textarea type="text" readonly='readonly' v-model="item.curWeekly.nextplan" ></textarea>
</td>
</tr>
</tbody>
</table>
methods:
// 设置高度
getHeight () {
let arr = this.arrData
for (let i in arr) {
let tableId = 'table' + i
let parent = document.getElementById(tableId) // 获取父元素
let textArea = parent.getElementsByTagName('textarea') // 获取父元素下面的所有textarea元素
// 对子元素的操作
console.log(textArea)
}
},
creat中:
async created () {
await this.getData() // 先获取数据,使用异步机制
this.getHeight() // 获取数据完了生成了节点之后才能获取到元素
},
最新文章
- (实例篇)php 使用redis锁限制并发访问类示例
- effective OC2.0 52阅读笔记(一 熟悉Objective-C)
- Android应用程序窗口(Activity)的窗口对象(Window)的创建过程分析(转)
- oracle 时间函数
- SE 2014年4月12日
- java 爬坑记-@WebServlet异步 不支持@Autowired
- poj 2229 Sumsets(记录结果再利用的DP)
- [IDE - Eclipse] JSP报错:The superclass “javax.servlet.http.HttpServlet” was not found on the Java Build Path
- 快速零配置迁移 API 适配 iOS 对 IPv6 以及 HTTPS 的要求
- 【APT】SqlServer游标使用
- HTML5 filesystem: 网址
- CentOS 6.5安装配置LAMP服务器(Apache+PHP5+MySQL)的方法
- LaTeX表格绘制备忘之Go语言中的几个表
- 20155239吕宇轩 Linux下IPC机制
- Maven根据不同环境打包不同配置文件
- KEIL5的安装
- Linux touch命令
- VSYNC与HSYNC与PCLK与什么有关系
- mysql原创博客
- NPOI之C#下载Excel