1.js学习
构造函数
function 构造函数名(){
this. 属性=值
this.方法 = function(){}
}*/
function Stars(uname,age,sex){
this.name = uname;
this.age = age;
this.sex = sex;
this.sing = function(sang){
console.log(sang);
}
}
var ldh = new Stars('刘德华',18,'男');
ldh.sing('冰雨');
var zxy = new Stars('张学友',19,'男');
console.log(ldh.name);
console.log(ldh);
//作业
function Hero(uname,type,blood,atk){
this.name = uname ;
this.type = type;
this.blood = blood;
this.attack = function(atk){
console.log(atk);
}
}
var lianpo = new Hero('廉颇','坦克',500,);
lianpo.attack=('近战');
var houyi = new Hero('后翌','射手',100,);
houyi.attack=('远程');
console.log(lianpo);
console.log(houyi);
/*
1new在内存中创建新的空对象
2让this指向新对象
3执行代码,添加方法
4返回这个新对象(不需要返回值)
*/
// 遍历对象 for(变量 in对象){}
for(var k in houyi){
console.log(k);
console.log(houyi[k]);
}
//随机数
function getrandom(min,max){
return Math.floor(Math.random()*(max-min+1))+min;
}
console.log(getrandom(1,100)) ;
var date = new Date();
var date2 = new Date('2022-3-14')
console.log(date.getFullYear());
console.log(date.getMonth()+1);//得到的月份比实际小一,周也是
console.log(date.getDay());
//数组
var arr = [1,2,3,3,5,5,22];
var newarr=[];
arr.push(4,'abc'); //push在数组后面加
arr.unshift(123,52);//unshift在前面
//pop删除数组最后一个元素,返回删除的元素
//shift 删除第一个元素 返回第一个元素
for(var i in arr ){
if (i >5){
newarr.push(arr[i]);
}
}
console.log(newarr);
//数组索引
console.log(arr.indexOf(22));//相同的数返回第一个的位置,没有返回-1
//lastIndexOf 从后往前查找,索引号不变
//数组转换为字符串
//1,toString 2,join(分隔符 )
console.log (arr.toString());
console.log (arr.join('-'));
//基本包装类型 把简单数据类型包装成复杂数据类型
/*字符串的不可变性
因为字符串不可变所以不要大量拼接字符串
*/
/*根据位置返回字符
*/
var str = 'andy';
//char at
for(var i =0; i < str.length;i++){
console.log(str.charAt(i));
}
//2.charCodeAt(index) 返回相应索引号的字符的ascii码
console.log(str.charCodeAt(0));
//3str[]
console.log(str[0]);
// concat('字符串1,字符串2')等于+
//substr(截取的起始位置 截取几个字符)
/*替换字符replace('a','b')只会替换第一个字符*/
/*简单数据类型(值类型)string number boolean undifined null
null 返回 object
复杂数据类型 object array Date*/
2.dom webapi
getElementById
//1 因为文档从上向下加载,script 写在下面
//2 get 获得 element 元素 用驼峰命名法
//参数 id 是大小写敏感的字符串
var timer= document.getElementById('time');
console.log(timer);
console.log( typeof timer);
console.dir(timer);
</script>
<ul>
<li>12345</li>
<li>12345</li>
<li>12345</li>
<li>12345</li>
<li>12345</li>
</ul>
<script>
var lis = document.getElementsByTagName('li');
console.log (lis);//以伪数组的形式输出
</script>
<div class="box">盒子</div>
<div class="box">盒子</div>
<script>
var box = document.getElementsByClassName('box');
console.log(box);//类名选择器
//queryselector 返回指定选择器的第一个元素对象 切记要加符号 .box #nav
</script>
<script>
//获取body 元素
var body1=document.body;
console.log(body1);
//获取html 元素
var html1= document.documentElement;
console.log(html1);
</script>
<button id="btn">唐伯虎</button>
<script>
//事件源 事件类型 事件处理程序 三要素
//点击按钮弹出对话框
var btn = document.getElementById('btn');//事件源
btn.onclick = function(){
alert('点秋香');
}
</script>
<button id="showTime">显示时间</button>
<div id="timer">某个时间</div>
<script>
var showTime = document.getElementById('showTime');
var timer= document.getElementById('timer');
showTime.onclick = function(){
var date = new Date();
timer.innerText = date;
}