1.对json的初步了解:JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式。易于人阅读和编写,同时也易于机器解析和生成。它基于JavaScript(Standard ECMA2623rd Edition December1999)的一个子集。 JSON采用完全独立于语言的文本格式,但是也使用了类似于C语言家族的习惯(包括C, C++, C#, Java,JavaScript, Perl, Python等)。这些特性使JSON成为理想的数据交换语言。
目前来说,使用json是为了更加便利地调用字符串:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
</body>
<script type="text/javascript">
var json={
a:4,b:5,c:6,
}
for(var i in json){
console.log(i);
console.log(json[i]);
console.log(i+json[i]);
}
</script>
</html>
2.arguments的使用:arguments是可变参,可以存储所有的参数,可以简化代码,提高性能:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
</body>
<script type="text/javascript">
function show(){
var a=0;
for(var i in arguments){
a+=arguments[i];
}
return a;
}
var b=show(5,54,64,21,31);
console.log(b);
</script>
</html>
3.行内式的获取与设置:通过自定义一个css()函数来获取并进行设置,jq中有这个方法,但在原生的js中需要自己编写:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script src="js/style.js" type="text/javascript" charset="utf-8"></script>
</head>
<body>
<div id="div0"></div>
</body>
<script type="text/javascript">
function css() {
if(arguments.length == 2) { //如果argument的长度为2;
return arguments[0].style[arguments[1]]; //返回 argument中第一个值中的样式为第二个值;
} else if(arguments.length == 3) { //如果argument的长度为3;
return arguments[0].style[arguments[1]] = arguments[2]; //返回argument中第一个值中的样式为第二个值,并设置为第三个值;
}
}
function show() {
var oDiv0 = document.getElementById('div0');
// var wd=css(oDiv0,'width');
// alert(wd);
css(oDiv0, 'width', '500px'); //将oDiv0中的宽度设置为500px
css(oDiv0, 'height', '200px');
css(oDiv0, 'background', 'blue');
var wd = css(oDiv0, 'width'); //获取oDiv0的宽度;
alert(wd);
}
show();
</script>
</html>
4.获取非行内式,这里要注意,这个方法能获取,无法进行设置,并且要注意currentStyle只能兼容IE,而getComputedSstyle则只对火狐谷歌兼容,所以需要写一个判断进行兼容:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style>
#box{width:500px;height:200px;background:blue;}
</style>
</head>
<body>
<div id="box"></div>
</body>
<script type="text/javascript">
function getstyle(obj,att){
if(obj.currentStyle){ //智能获取非行内样式,不能更改;
return obj.currentStyle[att];
}
else{
return getComputedStyle(obj,false)[att];
}
}
function show(){
var oBox=document.getElementById('box');
alert(getstyle(oBox,'height'));
}
show();
</script>
</html>
5.数组:属性:数组具有长度,既可以获取,也可以设置;
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript">
var arr=['ff',55,'ff',66];
console.log(arr.length);
</script>
</head>
<body>
</body>
</html>
通过设置数组的长度,可以做到数组的清空:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript">
var arr=['ff',55,'ff',66];
arr.length=0;
console.log(arr);
</script>
</head>
<body>
</body>
</html>
使用数组的原则:数组中应该只存一种类型的变量。
5.1数组的对象(常用):
Array.push( ) ,添加到array尾部的值,可以是一个或多个。方法push()将把它的参数顺次添加到array的尾部。它直接修改array,而不是创
建——个新的数组。
Array.pop( ),方法pop()将删除array的最后一个元素,把数组长度减1,并且返回它删除的元素的值。如果数组已经为空,则pop()不改变数
组,返回undefined。
Array.unshift(),添加到array头部的值,可以是一个或多个。
Array.shift(),删除array的第一个元素,把数组长度减1。
array.splice(start, deleteCount, value, ...),任意位置删除、添加、置换数组。
Array.concat( ),数组的拼接:方法concat()将创建并返回一个新数组,这个数组是将所有参数都添加到array中生成的。它并不修改array。如果要进行
concat()操作的参数是一个数组,那么添加的是数组中的元素,而不是数组。
Array.join( ),数组分割符,一中划线分割数组中的元素。
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript">
var arr=[1,2,3,4,5,6];
var arr2=[11,22,33];
//arr.方法名()
//arr.push(55);//从尾部添加一个数,有参数
//arr.unshift(66);//从头部添加一个数,有参数
//arr.pop();//从尾部删除一个数
//arr.shift();//从头部删除一个数
//arr.splice(2,3);//从下标为2(包含本身)后删掉3个数
//arr.splice(1);//从下标为1(包含本身)后全部删掉
//arr.splice(2,0,8,9);//任意位置插入任意个数
//arr.splice(2,2,8,9);//替换两个数
var arr3=arr.concat(arr2);
var arr4=arr.join('-');
console.log(arr3);//数组的拼接
console.log(arr4);
</script>
</head>
<body>
</body>
</html>
数组的排序:1.字母顺序;2.数字顺序
arr.sort();这里要注意这个方法只能对一位数数字的数组进行排序,两位及两位以上需要通过一个函数才能生效:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript">
var arr=['s','ad','vss','bill'];
arr.sort();//能够帮数组进行字母排序
var arr2=['10','20','40','3','9','5'];
arr2.sort(function(n1,n2){//数字的排序
return n1-n2;
});
console.log(arr2);
console.log(arr);
//给一个数组 arr3=[4,8,6,7,9,11,2]求最大数是哪个
var arr3=[4,8,6,7,9,11,2];
arr3.sort(function(a,b){
return b-a;
})
console.log(arr3);
console.log(arr3[0]);
//求两个数55,66哪个大?
function max(a,b){
if(a>b){
return a;
}
else if(a<b){
return b;
}
else{
return a;
}
}
var c=max(88,66);
console.log(c);
</script>
</head>
<body>
</body>
</html>
6.字符串的方法
字符串也具有长度,切空格也占有位置;
sUser.cherAt(),返回对应下标的字符
sUser.concat(),字符串的拼接
sUser.indexOf(),返回该字符在字符串中第一次出现的位置
sUser.lastIndexOf(),返回该字符在字符串中最后一次出现的位置
sUser.spilt(),将字符串分割为数组
sUser.toLocaleUpperCase(),将字符变为大写
sUser.substring(star,end),返回返回两个下标位置间的字符,第二个值不写则从指定下标开始一直到最后
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript">
var sUser='lilei';
//alert(sUser.length);//空格也是占位置的
console.log(sUser.charAt(4));//返回下标为4的字母
console.log(sUser.indexOf('o'));//返回该字母所在的位置,有的话返回下标,没有的话返回-1
//console.log(sUser.split('-'));
console.log(sUser.toLocaleUpperCase());//转成大写字母
//console.log(sUser.substring(1,3));//包头不包尾 il
console.log(sUser.substring(1));
</script>
</head>
<body>
</body>
</html>