1.函数
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<script type="text/javascript">
/* //声明函数
function fun(){
console.log("函数的使用")
}
//直接通过函数名访问调用函数
fun() */
/* var name = "Jim";
//返回值不需要声明，参数也不需要var声明
function sum(a,b,c){
var name = "Bob";
console.log(a+":"+b+":"+c);
console.log(name)
return a+b;
}
var res = sum(10,true,new Date())
console.log(res)
console.log(name) */
//全局函数 单个函数 alert()、confirm()、prompt()
//typeof(arg) 返回arg数据类型
/* console.log(typeof("aaa"));
console.log(typeof(true));
console.log(typeof(new Date())); */
/* var a = "5.5a1";
var b = "a11";
var c = "1a1";
//parseInt(arg) 把括号内的内容转换成整数之后的值。如果括号内是字符串，则字符串开头的数字部分被转换成整数，如果以字母开头，则返回“NaN”。
console.log(parseInt(a));
console.log(parseInt(b));
console.log(parseInt(c));
//parseFloat(arg) 把括号内的字符串转换成浮点数之后的值，字符串开头的数字部分被转换成浮点数，如果以字母开头，则返回“NaN”。
console.log(parseFloat(a));
console.log(parseFloat(b));
console.log(parseFloat(c));
*/
//eval()可以运算字符串，把字符串当做js脚本执行
eval("alert('aaa')");
console.log(eval("1+4"));
</script>
</head>
<body>
<!-- 事件驱动函数 给事件绑定处理函数-->
<input type="button" value="按钮" onclick="fun()" />
</body>
</html>
2.事件
属于标签的内容，可以给事件绑定处理函数。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<script type="text/javascript">
function fun(){
console.log("函数被执行了");
}
</script>
</head>
<body onload="fun()">
<!--
1.onclick:鼠标左键单击事件
2.ondblclick:鼠标左键双击事件
3.onfocus:获得鼠标焦点事件，只在获得鼠标焦点的那一刻触发
4.onblur:失焦事件，当标签失去鼠标焦点时触发
5.onmouseover:鼠标移入标签触发
6.onmouseout:鼠标移出标签触发
7.onload:当网页内容加载完毕触发
8.onchange:当标签失去鼠标焦点，标签内容发生改变时触发
9.onkeydown:当键盘按下时触发
10.onkeyup:当键盘抬起时触发
-->
<input type="button" value="按钮" onclick="fun()"/>
<hr />
<input type="button" value="双击" ondblclick="fun()" />
<hr />
<input type="text" onfocus="fun()" />
<hr />
<input type="text" onblur="fun()" />
<hr />
<div style="background-color: aqua; width: 100px; height: 100px;" onmouseover="fun()"></div>
<hr />
<div style="background-color: aquamarine;width: 100px;height: 100px;" onmouseout="fun()"></div>
<hr />
<input type="text" onchange="fun()" />
<hr />
<input type="text" onkeydown="fun()" />
<hr />
<input type="text" onkeyup="fun()" />
</body>
</html>
3.事件对象
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<script type="text/javascript">
function fun(e){
/* console.log(e.type);//返回事件类型
console.log(e.button);//0-点击左键 1-点击滚轮 2-点击右键
console.log(e.offsetX+":"+e.offsetY);//鼠标在标签上的位置
console.log(e.clientX+":"+e.clientY);//鼠标在浏览器中的位置
console.log(e.screenX+":"+e.screenY);//鼠标在显示器中的位置 */
console.log(e.keyCode);//返回按下键盘的键码
console.log(e.ctrlKey)
}
</script>
</head>
<body>
<input type="button" onclick="fun(event)" value="按钮" />
<hr />
<div style="background-color: aqua;width: 100px;height: 100px;" onmousedown="fun(event)"></div>
<hr />
<input type="text" onkeydown="fun(event)" />
</body>
</html>
4.内置对象
1.String字符串
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<script type="text/javascript">
/* charAt(n)：返回该字符串位于第n位的单个字符.
indexOf(char)：返回指定char首次出现的位置.
lastIndexOf(char) ：跟 indexOf() 相似，不过是从后边开始找.
substring(start,end) ：返回原字符串的子字符串，该字符串是原字符串从start位置到end位置的前一位置的一段.
substr(start,length) ：返回原字符串的子字符串，该字符串是原字符串从start位置开始，长度为length的一段.
toLowerCase() ：返回把原字符串所有大写字母都变成小写的字符串.
toUpperCase() ：返回把原字符串所有小写字母都变成大写的字符串.
split(分隔符字符) ：返回一个数组，该数组是从字符串对象中分离开来的，<分隔符字符>决定了分离的地方，它本身不会包含在所返回的数组中。 */
var a = "abcdefAgac";
console.log(a.length)
console.log(a.charAt(1));//返回该字符串位于第1位的单个字符.
console.log(a.indexOf("c"));//返回指定"c"首次出现的位置.
console.log(a.lastIndexOf("a"));//跟 indexOf() 相似，不过是从后边开始找.
console.log(a.substring(0,3));//返回原字符串的子字符串，该字符串是原字符串从0位置到3位置的前一位置的一段.
console.log(a.substr(1,3));//返回原字符串的子字符串，该字符串是原字符串从1位置开始，长度为3的一段
console.log(a.toUpperCase());//返回把原字符串所有小写字母都变成大写的字符串.
console.log(a.toLowerCase());//返回把原字符串所有大写字母都变成小写的字符串.
console.log(a.split(""));//返回一个数组，该数组是从字符串对象中分离开来的，<分隔符字符>决定了分离的地方，它本身不会包含在所返回的数组中
</script>
</head>
<body>
</body>
</html>
2.Array数组
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<script type="text/javascript">
/* concat() 用于连接两个或多个数组。arrayObject.concat(arrayX,arrayX,......,arrayX)
pop() 用于删除并返回数组的最后一个元素。
push() 可向数组的末尾添加一个或多个元素，并返回新的长度。
shift() 用于把数组的第一个元素从其中删除，并返回第一个元素的值。
slice() 可从已有的数组中返回选定的元素。arrayObject.slice(start(必须),end(可选)),该方法并不会修改数组
splice() 向/从数组中添加/删除项目，然后返回被删除的项目。该方法会改变原始数组。
splice(index(删除的位置),howmany(数量,为0不删除),item1,.....,itemX(插入的元素))
join(<分隔符>) ：返回一个字符串，该字符串把数组中的各个元素串起来，用<分隔符>置于元素与元素之间。
reverse() 使数组中的元素顺序反过来。如果对数组[1, 2, 3]使用这个方法，它将使数组变成：[3, 2, 1]。
sort() ：使数组中的元素按照一定的顺序排列。如果不指定<方法函数>，则按字母顺序排列。
对数字排序需要调用排序函数。 */
/* var arr = new Array();
arr[0] = 1;
arr[1] = 2;
arr[2] = 3;
console.log(arr); */
/* var arr = [1,2,3,4,5,6]
console.log(arr); */
var arr = new Array(1,2,3,4,5,6)
console.log(arr);
console.log(arr.length);
console.log(arr.concat(arr));//用于连接两个或多个数组
//console.log(arr.pop());//用于删除并返回数组的最后一个元素。
//console.log(arr.push(7));//push() 可向数组的末尾添加一个或多个元素，并返回新的长度。
//console.log(arr.shift());//shift() 用于把数组的第一个元素从其中删除，并返回第一个元素的值。
//console.log(arr.slice(1,3));//可从已有的数组中返回选定的元素。arrayObject.slice(start(必须),end(可选)),该方法并不会修改数组
/* console.log(arr.splice(1,3,3,4,5))
console.log(arr); *///向/从数组中添加/删除项目，然后返回被删除的项目。该方法会改变原始数组。
//console.log(arr.join("-"));//join(<分隔符>) ：返回一个字符串，该字符串把数组中的各个元素串起来，用<分隔符>置于元素与元素之间。
//console.log(arr.reverse());//数组中的元素顺序反过来
var b = ["a","v","s","c","b"]
console.log(b.sort())
var c = [2,34,1,7,4];
console.log(c.sort(sortNumber))
function sortNumber(a,b){
return a-b
}
</script>
</head>
<body>
</body>
</html>
3.Date日期
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<script type="text/javascript">
/* 获取日期
new Date() 返回当日的日期和时间
getFullYear() 返回四位数字年份
getDate() 返回一个月中的某一天 (1 ~ 31)
getMonth() 返回月份 (0 ~ 11)
getDay() 返回一周中的某一天 (0 ~ 6)
getHours() 返回 Date 对象的小时 (0 ~ 23)
getMinutes() 返回 Date 对象的分钟 (0 ~ 59)
getSeconds() 返回 Date 对象的秒数 (0 ~ 59))
设定日期
setDate() 设置 Date 对象中月的某一天 (1 ~ 31))
setMonth() 设置 Date 对象中月份 (0 ~ 11))
setYear() 设置 Date 对象中的年份（两位或四位数字） */
var date = new Date();
console.log(date);
console.log(date.getFullYear())
console.log(date.getDate())
console.log(date.getMonth())
console.log(date.getDay());
console.log(date.getHours());
console.log(date.getMinutes());
console.log(date.getSeconds());
var date1 = new Date();
date1.setDate(22)
date1.setMonth(10)
date1.setYear(2020)
console.log(date1)
</script>
</head>
<body>
</body>
</html>
4.Math
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<script type="text/javascript">
/* Math.abs(x) 绝对值计算；
Math.pow(x,y) 数的幂；x的y次幂
Math.sqrt(x) 计算平方根；
Math.ceil(x) 对一个数进行上舍入
Math.floor(x) 对一个数进行下舍入。
Math.round(x) 把一个数四舍五入为最接近的整数
Math.random() 返回 0 ~ 1 之间的随机数
Math.max(x,y) 返回 x 和 y 中的最大值
Math.min(x,y) 返回 x 和 y 中的最小值 */
console.log(Math.abs(-5));
console.log(Math.PI);
console.log(Math.pow(2,3));
console.log(Math.sqrt(25));
console.log(Math.ceil(4.1));
console.log(Math.floor(4.9));
console.log(Math.round(4.4));
console.log(Math.random());
console.log(Math.max(4,6.7777));
console.log(Math.min(4,6.7777));
</script>
</head>
<body>
</body>
</html>
2095
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
