页面的组成三部分
- HTML超文本标记语言
- css层叠样式
- js 脚本语言
JS的组成三部分
- ECMAScript,JS语法,包括变量,条件判断,循环,数据类型等,具有良好的兼容性
-DOM文档对象模型,程序员可以解决其兼容性问题
-BOM浏览器对象模型,程序员无法解决兼容问题
快捷键的使用
- webstrom中快速打出代码
- ul>li*6>a{列表$} 按下tab键显示:
- 强制换行 Mac:command+center;Windows:ctrl+center
- 代码收缩展开
- 收缩 Mac:command+减号;Windows:Ctrl+减号
- 展开 Mac:command+加号;Windows:Ctrl+加号
css引入方式
- 行内样式 style=“”
- 内嵌样式 style
- 外链样式 link=href
JS引入方式
- 行内引入
<!--onmouseover="this.style.background='yellow'; this.style.color='red'" -->
<!-- onmouseout="this.style.background='red'; this.style.color='#fff'"-->
- 内嵌式 script
一般写在footer位置
...
<script>
var oLeft=document.getElementById('left');
// 在document文档下,得到元素通过ID left
oLeft.onmouseover=function () {//函数function就是用来做事情的
oLeft.style.background='yellow';
oLeft.style.color='red';
}
//在移出的时候,让"left"这个元素,背景变成红色,文字变成白色
oLeft.onmouseout=function () {
oLeft.style.background="red";
oLeft.style.color="#fff";
}
</script>
... - 外链式
类似于在HTML文件中引入css样式表
<script src="##.js"></script>
JS 编程思路的形成
- 找到谁获取元素
- 给谁加什么事件
- 做什么事情
对象具有两个特征
属性 :没括号
方法:没括号
this的小总结
- 当函数被调用的时候,“.”前面是就是this
- 当函数被调用的时候,前面没点的话this就是window
- 点元素身上的事件被触发的时候,会触发一个函数,函数中的this指向当前被触发事件的这个元素;
输出方式
- alert() 弹出框
- console.log() 打印出来,在控制台输出
- console.dir() 打印出对象身上的属性和方法
- confirm()会有返回值:true false
- document.write()在页面输出
- innerHTML 可以输出元素所包裹的内容;innertext 输出文本;
- console.table()把对象以表格的形式输出
命名方式
- 除了第一个单词外,从第二个单词开始,每个单词的首字母大写;
- 常用的命名前缀
- a 数组(arry,arr,ary,aDiv)获取到一组元素对象
- o 对象( obj)普通对象 (oDiv)获取到一个元素对象
- s 字符串 string
- n 数字 number
- b 布尔值 Boolean:true false
数据类型
-
基本数据类型 : 对值的引用
- 字符串 string,
- 数字 number,
- 布尔值Boolean,
- 空对象null,
- undefined
引用数据类型 : 实际是对地址的引用
-
对象数据类型:
- 数组 arry,
- 对象 object,
- 数据 date(),
- RegExp /^\d{2}/
-
函数数据类型:
- function(){}
循环
c语言中的循环语句
-
for循环四部曲
定义
条件
语句
自增
判断语句
- if...else...if...else
- switch...case...break
隔行换色
- 条件判断:if...else...if...else
switch...case...break - 用%的思想:有几种情况就%几
习惯
- 不会写代码就写汉语,编程思想
- 不懂就百度
- 良好的写代码习惯让代码更简明