js引入
内部引用
<script type="text/javascript">
alert("hello js");
</script>
外部引用
<script type="text/javascript" src="test.js"></script>
js变量
js变量是临时存储的,js是弱类型语言,不需要定义数据类型,使用的时候区分数据类型
var x = 1;
var x = 2,name = "admin"
var x;
var = 1;
js调试
alert弹窗 or console.log
var y;
var x;
x = '123';
y = '1231';
alert(y + 1 );
console.log(x+1);
js数据类型
序号 | 类型 | 作用 |
---|---|---|
1 | number | 数值类型,整形,浮点 |
2 | string | 字符串类型,单引号内 |
3 | boolean | 布尔 |
4 | underfine | 未定义(异常),一般指声明为赋值变量 |
5 | null | 空类型 |
6 | object | 对象类型 |
7 | NaN | Numberis,NaN(),数字返回false,不是返回true |
类型转换
parselnt():整形
parseFloat():浮点
Number():数值
Boolean():布尔
强制类型转换,自动类型转换
var str = "123";
console.log(str+1); //字符串拼接
console.log(str*1+1); //自动类型转换
console.log(parseInt(str)+1); //强制类型转换
JS控制表单
通常,name 是给 后端用的,id是给js用的。
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport"
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
<script type="text/javascript" src = js.js></script>
<form>
用户名
<input type="text" id="username" name="username"/><br/>
<input type="radio" name="sex" value="1" checked> 男
<input type="radio" name="sex" value="0"> 女<br/>
<input type="button" id="but" onclick="show()" value="提交"/>
</form>
</body>
</html>
function show() {
var sex = document.getElementsByName("sex");
var sext;
if (sex[0].checked){
sext = sex[0].value;
alert(sext);
}else {
sext = sex[1].value;
alert(sext);
}
}
JS控制列表框
三级联动
<!doctype html>
<html lang="en">
<head>
<script type="text/javascript" src = js.js></script>
<meta charset="UTF-8">
<meta name="viewport"
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body onload="ymd()">
<form>
<select name="yyyy" id="yyyy" onchange="selectYMD()"> </select>年
<select name="mm" id="mm" onchange="selectYMD()"> </select>月
<select name="dd" id="dd"> </select>日
</form>
</body>
</html>
function ymd() {
var yyyy = document.getElementById("yyyy")
var mm = document.getElementById('mm')
var dd = document.getElementById('dd')
var date = new Date();
var year = parseInt(date.getFullYear());
initselect(yyyy,1999,year);
initselect(mm,1,12);
initselect(dd,1,31);
var ylen = yyyy.length;
yyyy.selectedIndex = Math.round(ylen/2)
}
function initselect(obj,start,end) {
for (var i=start;i<=end;i++){
obj.options.add(new Option(i,i))
}
}
function selectYMD() {
var yyyy = document.getElementById("yyyy")
var mm = document.getElementById('mm')
var dd = document.getElementById('dd')
var m = parseInt(mm.value);
var dayEnd;
if (m == 4 || m == 6 || m == 9 || m == 11){
dayEnd=30;
}else if (m ==2){
dayEnd=28;
var y = parseInt(yyyy.value);
if ((y % 4 ==0 && y % 100 !=0) || y % 400==0)
dayEnd=29;
}else {
dayEnd=31;
}
dd.options.length=0;
initselect(dd,1,dayEnd);
}
转载:https://blog.csdn.net/qq_38626043/article/details/117231162
查看评论