web蓝桥杯真题：健身大调查

Outcir2024-04-03 21:59

代码及注释：

javascript 复制代码

function formSubmit() {
  // TODO：待补充代码
  const quescontent = document.querySelector('#quescontent')
  const height = document.querySelector('#height')
  const weight = document.querySelector('#weight')
  const male = document.querySelector('[name="male"]:checked')    //属性选择器
  const place = document.querySelectorAll('[name="place"]:checked')
  const result = document.querySelector('#result')
  let placeArr = []
  place.forEach(item => {        //处理赋值
    if(item.value == 1) {
      placeArr.push('公园')
    } else if(item.value == 2) {
      placeArr.push('健身房')
    } else {
      placeArr.push('户外')
    }
  })
  result.style.display = 'block'
  quescontent.style.display = 'none'
  let html = `<div>问卷提交完毕，感谢您的参与！</div>
  <div>身高${height.value}cm，体重${weight.value}kg，性别${male.value == 0 ? '男' : '女'}，会在${placeArr.join('、')}锻炼。</div>`        //array.join() 用指定分隔符分割
  result.innerHTML = html
}

知识点：

1.属性选择器

let div = document.querySeletor('[name="male"]:checked')

2.分割字符串

array.join('') //数组变为字符串

array.join('、') //数组的，分隔符变为、