javascript(脚本语言)
一、作用
- 控制网页交互
- 元素间交互
- 事件监听等
二、使用
script标签 嵌套JavaScript代码
script标签 使用scrip的 src 属性 降低耦合性 xxx.js
代码注释使用//或/* */
三、变量
定义方式
var name = "小米";
var pi = 3.14;
var x = 7;
var y = 8;
var z = x + y; 数据类型
var length = 7; // 数字number
var lastName = "Gates"; // 字符串string
var cars = ["Porsche", "Volvo", "BMW"]; // 数组object
var x = {firstName:"Bill", lastName:"Gates"}; // 对象object
var sex = true; //布尔boolen
var a;
var a=null //未定义型undefind
typeof(x) //查看类型运算符
1.算数运算符
2.赋值运算符
3.逻辑运算符
4.比较运算符
四、函数
类别
1.系统函数
2.自定义函数
function fname(参数列表){
执行体;
[return 返回值]
}调用
fname(参数);可以将函数在js文件中调用，即加载时调用。
五、对象
数组对象
1.定义
var objArray = ["小米","小花","小兰"];2.遍历
var str;
for(var i=0;i一般对象
1.定义(属性、行为)
var person ={
name:"小明",
sex:'男',
age:30, //属性
setName:function(n){
this.name = n;
},
setAge:function(a){
this.age = a;
},
getName:function(){
return this.name;
} //行为
}2.使用
alert(person.name);
alert(person["name"]);
alert(getName());
person.setAge(20);六、语句
1.判断语句 if-else if
2.循环语句 for while do-while
3.选择语句 switch
4.顺序语句
HTML DOM
DOM:文本对象模型
一、DOM树模型
三种对象
1.元素对象 img
2.属性对象 src
3.文本对象 font
获得元素的方法
1.通过 getElementById()获取
var x = document.getElementById("id值");
x.innerHTML="你好呀~";//写入对应位置HTML语句
x.style.fontSize="50px";//font-size换成fontSize
-------
var img = document.getElementById("id值");
img.src="/图片路径";
img.width="300px"
img.height="300px"//更改属性
alert(img.alt);//获取属性 2.根据标签名getElementsByTagName("tag_name")
var imgArr = document.getElementsByTagName("img");
if(imgArr!=null && img.Arrlength>0){
var img = imgArr[0];
}//根据标签名返回数组,按顺序从数组中取出使用3.通过 createElement()...创建
var p = document.createElement("p");
var a = document.createElement("a");
a.href="http://www.baidu.com";
var t = document.createTextNode("我是百度");
a.appendChild(t);//设置嵌套关系:t加入a中
p.appendChild(a);//设置嵌套关系:a加入p中
document.getElementById("div").appendChild(p);//设置嵌套关系;p加入div中
document.getElementById("div").removeChild(p);//移除事件
一个二级列表联动例子
- 效果：选择不同省，自动联动显示该省下的所有市
- 实现
BOM
浏览器对象模型BOM使JavaScrip有能力与浏览器对话，尚无正式标准，因此才会有Jquery等前端框架。
setTimeout("alert('时间到')",5000);//设置计时器，多少毫秒后做某事
setInterval("alert('时间到')",5000);
var a = setInterval（"function_name()",5000）;//设置循环计时器，每隔多少毫秒做某事
clearInterval(a);//清除计时器
a = setInterval（"function_name()",5000）//重新启动计时器
location.href="www.baidu.com";//跳转可以无需a标签,设置地址栏
history.back();//浏览器后退
history.forword();//浏览器前进- [ ] 下一步，应该学习框架咯~