一 数组对象
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script>
//var l=[111,222,333];
//console.log(typeof l);
//var l2=new Array([1,2,3,4]); //创建数组
//join 方法
<!--var s=['hello','world'].join(" ");-->
<!--console.log(s)-->
// 原生类方法toString()： 将对象转化成字符串
<!--var s1=[12,3,4,32,65];-->
<!--console.log(s1);-->
<!--console.log(typeof s1);-->
<!--console.log(s1.toString()); //"[12,3,4,32,65]"-->
<!--console.log(typeof s1.toString());-->
/* //反转 reverse
var q=[123,46,75,321];
console.log(q.reverse());
// sort ： 默认排序，是以最高位的ASCLL码排序的
console.log(q.sort());
// 删除方法 splice方法
q.splice(1,3);
console.log(q); */
// 向数组添加或者删除元素 push pop 后面添加或者删除 shift unshift 前面添加或者删除
var w=[11,22,33];
<!--w.push(44);-->
<!--console.log(w); //[11,22,33,44]-->
<!--console.log(w.pop()); //[44]-->
console.log(w.shift());
w.unshift([77,88]);
console.log(w);
console.log(w.shift());
</script>
</head>
<body>
</body>
</html>
二 时间对象
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script>
var ID;
function start(){
if(ID==undefined){
foo();
ID=setInterval(foo,1000);
}
}
function foo(){
var timer=new Date().toString(); //获取当前时间字符串
var ele=document.getElementById("time"); //获取操作标签对象
ele.value=timer; //对操作标签对象进行赋值
}
function end(){
clearInterval(ID);
ID=undefined;
}
</script>
</head>
<body>
<input type="text" id="time" >
<button onclick="start()" >start</button>
<button onclick="end()" >end</button>
</body>
</html>
三 显示时间对象
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script>
var ID;
function start(){
if(ID==undefined){
foo();
ID=setInterval(foo,1000);
}
}
function foo(){
var timer=new Date().toString(); //获取当前时间字符串
var ele=document.getElementById("time"); //获取操作标签对象
ele.value=timer; //对操作标签对象进行赋值
}
function end(){
clearInterval(ID);
ID=undefined;
}
</script>
</head>
<body>
<input type="text" id="time" >
<button onclick="start()" >start</button>
<button onclick="end()" >end</button>
</body>
</html>
四 函数对象
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script>
//function 函数名(){
//}
//直接调用
/*
function foo(){
alert(123)
}
foo();
function add(x,y){
console.log(arguments);
var sum=0;
for (var i=0;i<arguments.length;i++){
sum+=arguments[i];
}
return sum;
}
var s=add(1,4,2,6);
console.log(s)
*/
// 匿名函数
(function (){
})()
</script>
</head>
<body>
</body>
</html>
# s1='hello' # # s2='world' # # s3='fang' # # s=" ".join([s1,s2,s3]) #join是符号的拼接属性 # print(s) # # # ret=(lambda x,y:x+y)(4,6) #匿名函数 # print(ret)
五 js 的查找标签
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script>
function t(){
var ele=document.getElementsByClassName("c1")[0];
ele.style.color="green";
}
</script>
</head>
<body>
<div class="c1" onclick="t()">fang</div>
</body>
</html>
六 搜索框
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script>
function foo(){
var ele=document.getElementById("search");
ele.value=" ";
}
function bar(){
var ele=document.getElementById("search");
if(!ele.value.trim()){
ele.value="用户名";
}
}
</script>
</head>
<body>
<input type="text" id="search" value="用户名" onfocus="foo()" onblur="bar()">
<div>
<div>div</div>
<p>ppp</p>
</div>
</body>
</html>
七 DOM
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script>
// window.alert(123);
//var ret=confirm("是否继续...")
// console.log(ret)
var ret=prompt("please input a num:")
console.log(ret)
</script>
</head>
<body>
</body>
</html>
八 导航属性
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<div class="outer">
<p>p5</p>
<p>p4</p>
<div class="index">
<p id="p1">p1</p>
</div>
<p>p2</p>
</div>
<script>
var ele_p1=document.getElementById("p1");
var ele_p1_pa=ele_p1.parentElement;
console.log(ele_p1_pa.nextElementSibling);
</script>
</body>
</html>