CSS和JS
CSS
定位
position: 配合方向使用
relative 相对定位
相对元素本身在文档流中的原位置而言
absolute 绝对定位 完全脱离文档流
子父集定位
父元素有设置相对定位，子元素相对与父级定位
相对窗体定位
父元没有设置相对定位，相对窗体定位
fixed 固定定位，完全脱离文档流
浮动：
让元素按照一定的方向进行移动，当遇到其他浮动|浏览器的边界的时候停止移动
float 浮动
left 让元素向左移动
right 让元素向右移动
清除浮动
clear
left 我的左边不能有浮动元素
right 我的右边不能有浮动元素
both 我的两边不能有浮动元素
1）、使用clean属性
2）、给父级高度
3）、在父级中定义，overflow：hidden
应用场景：被我们使用在让块元素一行显示
块元素一行显示
1）、浮动
2）、display
inline 行内元素
block 块元素
inline-block 行内块
行内与块的特点都存在
宽度由内容撑起
可设置宽高
浮动效果（清除浮动的问题）和设置inline-block效果几乎一致
JS
javascript是一种动态语言
作用：验证发往服务器端的数据、增加Web互动、加强用户体验度等
js的组成：
1、ECMAScript js的核心语法
2、BOM 浏览器对象模型
3、DOM 文档对象模型
关系：BOM包含DOM
使用方式：
行内：元素上使用js代码
内部：html内部定义script标签对，标签对中定义js代码 onclick=“console.log('')”
外部：外部定义js文件，文件中定义js代码，在使用的html中使用script标签对用来引用
注意：一个script标签不能既用来引入外部js文件，又定义js代码
js代码在html界面的位置
在html中的任意位置定位
推荐：
head中，便于后期维护
body结束之前：保证在执行js代码时，页面所有内容都加载完成之后执行，如果要在head中需配合window.onload一起使用
变量：
js中使用var关键字定义变量
声明同时赋值
var 变量名= 值；
先声明，后赋值
var 变量名；
变量名=值；
动态语言的特点：类型由赋值决定
注意：
可同时打印多个变量值
可声明多个变量
变量声明可省略var
变量分类：
全局变量：
局部变量：函数中定义的变量
变量的作用域提升：
前提是必须使用var声明的变量
只提升变量的声明，提升到当前作用域的最上面
变量不赋值，存在默认值 undefined
js数据类型：
基本数据类型
Number 类型 在控制台中显示蓝色
表示整数、小数，NaN（not a number）
如何获取NaN类型的数据
1、赋值NaN
2、运算无法计算正确的结果
String类型
定义在一对"|'中
Boolean类型
true|false
Null类型
1、赋值Null
2、获取不到元素
Undefined类型
1、赋值Undefined
2、只声明不赋值
function函数类型
复合数据类型
Object 对象类型 {}表示
以键值对的形式存在
key：value
多个键值对使用“，”隔开，最后一个不用添加“，”
key属性，满足标识符的命名规则
key：value都是字符串
key如果满足标识符的命名规则，前后引号可以省略
typeof 测试数据的数据类型
使用方式：
typeof 数据
typeof（数据）
数据类型转换
显示数据类型转换
通过其他方式|函数，手动让数据改变其类型
Number（数据）
String（数据)
Boolean（数据）
隐式类型转换
目的不是改变数据类型，但是执行过程中会隐式改变数据类型
运算符:
+ 字符串的连接符使用
= == === 之间的区别:
= 赋值
== 比较数据是否相同
=== 比较数据和类型是否都相等
先比较类型,后比值
! 非 取反
!! 不变
!!!取反
...
逻辑运算符: && ||
java中逻辑运算符两边的操作数必须为boolean类型的
js中中逻辑运算符两边的操作数可以都是boolean,也可以有其他类型的数据参与,如果有, 结果肯定为其中一个操作数
&& 一个为false就是false
第一个操作数转为boolean,为false,结果就为第一个操作数的值
为true,,结果就为第二个操作数的值
|| 一个为true就是true
第一个操作数转为boolean,为true,结果就为第一个操作数的值
为false,结果就为第二个操作数的值
{} 就是块
java中{}自成作用域
js中块不是作用域,作用域在js中之间函数function
数组:
可以存储任意个任意类型的数据,长度可变
创建数组的方式:
new Array(); 构建一个空的新数组
new Array(数据1,数据2..) 创建的同时赋值
[数据1,数据2...] 字面量的创建方式 --推荐
数组有序: 索引顺序 从0开始
根据索引操作数组,当索引非0~n的整数,作为数组的自定义属性
数组的遍历:
1.普通for
2.for .. in
3.foreach
数组中常用的方法:
slice 截取（切片）数组，原数组不发生变化
一个参数 作为起始索引,从参数索引位置开始,截取到最后,返回
两个参数 第一个参数作为其实索引,第二个参数结束索引,结束索引不包含
原数组不发生改变
splice 剪接数组，原数组变化，可以实现前后删除效果
一个参数 作为起始索引,从参数索引位置开始,截取到最后,返回,原数组为截取后剩下的
两个参数 第一个参数作为其实索引,第二个参数作为个数
3~n个参数 重第一个参数位置开始,拿第二个参数个,替换成为第三个参数及以后的数据
js中的函数(java中的方法)
封装功能,处理业务的代码块
定义:
函数声明
function 函数名 (参数列表) {
函数体;
[return 返回值;]
}
调用:
1. 函数名(实参);
2. 转换函数表达式,在最后添加()自执行
在函数声明的前面添加~|!|+|-
在函数声明天后添加()包裹
函数表达式的方式
var 变量名 = function 函数名 (参数列表) {
函数体;
[return 返回值;]
};
函数名一般省略,不可以通过函数进行调用,只能通过变量名,函数名可以在函数内部进行递归使用
调用:
1.通过变量名调用 变量名(参数);
2.函数表达式最后添加(),直接直接这个函数,自执行
注意:参数省略var关键字
