問題描述

現(xiàn)在我需要填寫一個網(wǎng)頁問卷，里面全部都是單選框。
作為一個有想法的前端的人員，我想通過JS代碼去幫我填寫

此文章僅供學(xué)習(xí)，請勿用于其他用途

實現(xiàn)過程

獲取單選框結(jié)點

通過觀察頁面，我發(fā)現(xiàn)所有的單選框都在包裹在無序列表ul的li下的，class名稱為item

直接開始嘗試獲取DOM結(jié)點

document.getElementsByClassName('item')

總共170道題目，打印出來的數(shù)組為340長度

很自然的知道了，我們獲取到的是所有的單選框

賦值單選框

下一步，我們對獲取到的數(shù)組進(jìn)行賦值
首先嘗試第一個……

經(jīng)過不斷的嘗試，我終于找到了實現(xiàn)方法
在我獲取到item結(jié)點后，我發(fā)現(xiàn)我并不能對Input的值進(jìn)行修改，于是我繼續(xù)獲取子節(jié)點，直到獲取到input的結(jié)點

---

數(shù)組操作

在完成單個編寫，知道全部邏輯后，開始進(jìn)行數(shù)組操作

大致思路

• 首先，獲取全部結(jié)點
• 以數(shù)組的長度循環(huán)（從0開始，i+=2）
  • 因為只需要第一個選擇感興趣即可

// 獲取全部數(shù)組 const data = document.getElementsByClassName('item');for(let i = 0 ; i < data.length ; i += 2){data[i].childNodes[1].childNodes[0].checked=true }

實現(xiàn)效果

---

當(dāng)然，在完成基本功能后，可以嘗試對功能進(jìn)行增強(qiáng)
比如說，有些問卷中不能全部選擇同一個，可以進(jìn)行分組，然后用隨機(jī)數(shù)進(jìn)行賦值checked

總結(jié)

以上是生活随笔為你收集整理的JS实现自动填写问卷【JS小工具】的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。