js布局如何实现单选按钮控件

小编给大家分享一下js布局如何实现单选按钮控件,希望大家阅读完这篇文章之后都有所收获,下面让我们一起去探讨吧!

本文实例为大家分享了javascript布局实现单选按钮控件的具体代码,供大家参考,具体内容如下

主要是对最近学习的知识做练习,可以巩固提高!

效果如下图:

代码如下:





单选控件

.radioD{
width:300px;
height:300px;
background:url(field.jpg)no-repeat;
}
.radioDli{
font-size:18px;
font-family:Arial;
list-style:none;
}
.leftU{
float:left;
}
.rightU{
float:right;
margin-right:80px;
}


window.onload=function(){
varaLi=document.getElementsByTagName('li');
varaInput=document.getElementsByTagName('input');
vari=0;
varbtn=document.getElementById('foodBtn');
btn.onclick=function(){
for(i=0;i




  • 面条1
  • 馒头1
  • 烧饼1
  • 窝头1
  • 面条2
  • 馒头2
  • 烧饼2
  • 窝头2
  • 我的食物

    看完了这篇文章,相信你对“js布局如何实现单选按钮控件”有了一定的了解,如果想了解更多相关知识,欢迎关注恰卡编程网行业资讯频道,感谢各位的阅读!

    发布于 2021-05-30 14:05:14
    分享
    海报
    165
    上一篇:PHP文件的操作示例 下一篇:js键盘事件如何实现人物的行走
    目录

      忘记密码?

      图形验证码