单选 : 通过name指定为一组,只能选择一个  一组一个选项

<input type="radio" value="" name="sex"/>男
<input type="radio" value="" name="sex"/>女<br/>

两个input时:

Js中判断哪一个被选中:

首先,通过input中的name属性值查到该组对象 。

var gender=document.getElementsByName("sex");  是一个数组

然后,在根据每个对象的checded属(true 或者false)来判断选中与否。

if(gender[].checked){//下标法取出数组中的值
alert("你选中了男性"); }
if(gender[].checked){
alert("你选中了女性");
}

最后,通过每个对象的value方法取到值。

if(gender[].checked){//下标法
alert("你选中了男性:"+gender[].value);//取出数组中的值
}
if(gender[].checked){
alert("你选中了男性:"+gender[].value);//取出数组中的值
}

多个单选框时:

<input type="radio" value="yinger" name="Person"/>婴儿
<input type="radio" value="shaonian" name="Person"/>少年<b/>
<input type="radio" value="qingnian" name="Person"/>青年
<input type="radio" value="zhognnain" name="Person"/>中年<br/>

首先,通过name获取元素  是一个数组

var pers=document.getElementsByName("Person");

然后,循环+操作

for(var i=;i<pers.length;i++){
if(pers[i].checked){
alert("你选中的是:"+pers[i].value);
break;//选中一个就可以跳出来
}
}

使用开关变量的实质:

首先,定义一个默认的布尔值,一般为全局。

然后,在真正的操作中改变这个布尔值

最后,在真正的操作之外,进行判断在操作其他

例如:

 /*单选有多个input时*/
var pers=document.getElementsByName("Person");
var flag=true;//1标志
for(var i=;i<pers.length;i++){
if(pers[i].checked){
flag=false;//2改变
alert("你选中的是:"+pers[i].value);
break;
}
}
if(flag){//3判断
alert("你没有选中");
return false;
}

复选: 通过name指定为一组,但是可以同时选择多个 一组多个选项

<input type="checkbox" name="vehicle" value="Bike"> <br>
<input type="checkbox" name="vehicle" value=""><br>
<input type="checkbox" name="vehicle" value="">

下拉: 通name指定为一组,value指定不同的值    一组一个选项

<select name="cars">
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="fiat">Fiat</option>
<option value="audi">Audi</option>
</select>

获取和设置input里面的值:对象的value

获取其他元素中的内容(标签里面的内容)

(innerhtml:包括任何标签也会原样输出):

InnerText:获取标签里面的文本内容

javascript 是一个弱类型的语言   数组中可以是任何类型数据

数组的属性:

(1)        length:数组中有多少个元素

(2)        如何访问数组中每一个值:[下标值]:下标值从0开始

图片切换的实质是:改变图片的路径

与input有关的一些操作的更多相关文章

  1. input中range相关操作

    利用mousover触发函数对range的操作练习 <!DOCTYPE html> <html> <head> <meta charset="utf ...

  2. jQuery中对 input 控件的操作

    jquery radio取值,checkbox取值,select取值,radio选中,checkbox选中,select选中,及其相关 1.获取值 jquery取radio单选按钮的值 $(" ...

  3. input复选框操作的部分高频率使用代码

    1. 获取单个checkbox选中项(三种写法): $("input:checkbox:checked").val() 或者 $("input:[type='checkb ...

  4. 关于jQuery——attr方法和prop方法获取input的checked属性操作

    经常使用jQuery插件的attr方法获取checked属性值,获取的值的大小为未定义,此时可以用prop方法获取其真实值,下面介绍这两种方法的区别: 1.通过prop方法获取checked属性,获取 ...

  5. 前端获取文件input框的美化操作

    前面我们说了一种利用input框和js的当时获取本地文件内容的情况-详细信息参考 2017年11月8日前端用js获取本地文件的内容 以上方式获取的按钮是系统默认的显示,有时候我们需要对按钮的外观进行美 ...

  6. Python全栈开发之路 【第十六篇】:jQuey的动画效果、属性操作、文档操作、input的value

    01-动画效果 show 显示 概念:显示隐藏的匹配元素 语法:show(speed,callback) 参数: speed:三种预定速度之一的字符串('slow','normal','fast')或 ...

  7. appium+python自动化38-adb shell按键操作(input keyevent)

    前言 接着上篇介绍input里面的按键操作keyevent事件,发送手机上常用的一些按键操作 keyevent 1.keyevent事件有一张对应的表,可以直接发送对应的数字,也可以方式字符串,如下两 ...

  8. appium+python自动化-adb shell按键操作(input keyevent)

    前言 接着上篇介绍input里面的按键操作keyevent事件,发送手机上常用的一些按键操作 keyevent 1.keyevent事件有一张对应的表,可以直接发送对应的数字,也可以方式字符串,如下两 ...

  9. 从0到1搭建移动App功能自动化测试平台(2):操作iOS应用的控件

    转自:http://debugtalk.com/post/build-app-automated-test-platform-from-0-to-1-Appium-interrogate-iOS-UI ...

随机推荐

  1. 在Ubuntu安装go编译环境

    在Ubuntu安装go编译环境 好记性不如烂笔头,所以趁热打铁记录下golang编译环境的安装过程. 首先下载一些依赖包: sudo apt-get install bison ed gawk gcc ...

  2. SpringBoot学习笔记(3):静态资源处理

    SpringBoot学习笔记(3):静态资源处理 在web开发中,静态资源的访问是必不可少的,如:Html.图片.js.css 等资源的访问. Spring Boot 对静态资源访问提供了很好的支持, ...

  3. HackerRank - flipping-the-matrix 【数学】

    题意 一个矩阵中 每一行 每一列 都可以倒置 在不断进行倒置后 求 左上的那个 N * N 矩阵 的和 最大为多少 思路 M = 2 * N 通过 倒置特性 我们可以发现,最左上的那个矩阵 第 [I] ...

  4. 解决pod没有权限问题

    chmod 644 路径 echo $? 检测上一条命令的执行结果,如果是0则执行成功

  5. php一维数组的创建

    php一维数组的创建 (1)通过array函数声明数组 使用array 函数定义数组,该函数返回通过所接受接收的参数建立的数组.array 函数使用的格式如下. $arry_name = array( ...

  6. Codeforces 455C Civilization:树的直径 + 并查集【合并树后直径最小】

    题目链接:http://codeforces.com/problemset/problem/455/C 题意: 给你一个森林,n个点,m条边. 然后有t个操作.共有两种操作: (1)1 x: 输出节点 ...

  7. Spring4自动装配(default-autowire) (转)

    原文地址:http://blog.csdn.net/conglinyu/article/details/63684957 Spring 自动装配 通过配置default-autowire 属性,Spr ...

  8. Python编程-一个小爬虫工具的实现过程

    需求描述: 1,打开网站: 2,获取网站的文件内容: 3,返回保存到文件中: 这里的就用到了多线程的方法 import requests,threading,time def write_html(u ...

  9. SpringBoot_05_热部署和debug

    一.pom.xml配置 增加以下pom.xml配置 <!--1.spring-boot插件--> <plugin> <groupId>org.springframe ...

  10. codeforces 553A A. Kyoya and Colored Balls(组合数学+dp)

    题目链接: A. Kyoya and Colored Balls time limit per test 2 seconds memory limit per test 256 megabytes i ...