web蓝桥杯真题:冰墩墩心情刻度尺

web蓝桥杯真题:冰墩墩心情刻度尺

代码:

// TODO: 待补充代码
BingDunDun.className='BingDunDun not-satisfied'
range.onchange = (e) => {
  let value = Number(e.target.value); // value 进度条的值
  // TODO: 待补充代码
  if(value == 25) {
    BingDunDun.className='BingDunDun a-little-unsatisfied'
  } else if(value == 50) {
    BingDunDun.className='BingDunDun ordinary'
  } else if(value == 75) {
    BingDunDun.className='BingDunDun satisfied'
  } else if(value == 100) {
    BingDunDun.className='BingDunDun great'
  } else {
    BingDunDun.className='BingDunDun not-satisfied'
  }
};

考察:

元素添加类名:element.className='class1 class2'   

此外,

行内样式操作:element.style.width = '250px'

给元素添加样式:element.classList.add(newClassName)      

给元素移除样式:element.classList.remove(oldClassName)

className和classList.add的区别:

前者是直接替换原来的类名,后者是在原类名基础上再加一个类名

转载请说明出处内容投诉
CSS教程_站长资源网 » web蓝桥杯真题:冰墩墩心情刻度尺

发表评论

欢迎 访客 发表评论

一个令你着迷的主题!

查看演示 官网购买