js小结

js弱类型语言,java强类型语言
使用var定义变量

        数据类型
            简单数据类型
                1.String 字符串   黑色
                    一对引号之间包裹字符  ''|""
                2.Number 数值型
                    整数  小数    NaN:Not a Number
                3.Boolean 布尔类型
                    true,false
                4.Undefined 未定义
                    1.赋值undefined
                    2.只声明未赋值,变量的是undefined
                5.Null 空
                    1.赋值null
                    2.获取不到元素
                6.function 函数
                    function 函数名(参数){
                        函数体..
                    }


            复杂数据类型
                对象类型
                js中一切皆对象!!!!
                {
                    键值对形式的数据
                    key:value,
                    key:value,
                    ...
                }

           运算符 typeof 返回数据的数据类型,小写的形式
            typeof 数据
            typeof(数据)

对象类型不参与类型转换
自动|隐式转换
+ -

        强制|显示转换
            所有类型的数据都可以被转换成为以下三种类型
            String(参数);
                返回值:'参数'
            Number(参数)
                返回值:
                    ''          0
                    ' '         0
                    '纯数字'     纯数字
                    '非纯数字'   NaN
                    false       0
                     true        1
                     null        0
                     undefined   NaN
            Boolean(参数)
                返回值:
                    0               false
                    1               true
                    ''              false
                    ' '             true
                    'abc'             true
                    null            false
                    undefined       false

谷歌浏览器:默认字体大小16px,微软雅黑
1. font-family: “华文行楷”; 字体文本样式
2. font-size 字体大小
3. font-style 字体样式 italic斜体 normal正常
4.font-weight 文本加粗
100~900
bold 加粗
bolder 加粗
normal 正常
lighter 正常
5.list-style-position
inside
outside

盒子模型: 内容+padding+border+margin
用户所看到元素的大小: 内容+paddiong+border
padding: 内边距
如果内容设置了背景样式,会延伸到内边距上

        padding:50px; 上下左右都存在相同的50px内边距
        padding 10px 50px; 上下10px 左右50px
        padding:10px 50px 100px;  上  右  下   左与对面相同
        padding:10px 50px 100px 200px;  上  右  下   左
    margin: 外边距

    line-height 行高
    text-align: 水平方向的对其方式  块和行内块能够使用
    vertical-align 垂直方向的对其方式   行内|行内块有效

运算符:
= 赋值
== 内容是否相等,相等true,不相等返回false
=== 内容和类型是否都相等,都相等才返回true,任何一个不相等就false
先检查类型,类型不相等,内容不比了
! 非

        {} 块
            java中{}是作用域
            js中{}比较直观,没有没有作用域的作用

1.html 标签 常用的 作用 属性 特点
2.样式
使用css的方式
选择器
样式
盒子模型
浮动
定位
3.js jq vue *****

    文档流: 块:从上倒下  行内:从左到右

    浮动  float : left|right
        让元素按照指定的方向移动
        停止:当遇到周围其他元素或浏览器的边界的时候停止

        脱离文档流(半脱离)
        内容会让出前面浮动元素的位置

清除浮动:
1.clear 元素周围不能有浮动元素
left 元素的左边不能有浮动元素
right 元素的右边不能有浮动元素
both 元素的两边不能有浮动元素
2.给浮动元素的父元素设置高度
3.overflow: hidden; 超出部分隐藏,但是可以使用它来达到清除浮动的效果,可以让父元素在文档流中占位置

position 定位
结合方向值一起使用
top left right bottom
relative 相对定位 不脱离文档流
相对自身原位置定位
absolute 绝对定位 完全脱离文档流
如果父元素身上有设置position:relative,相对父元素定位—子父集定位
如果父元素身上没有设置position:relative,相对于窗体定位
fixed 固定定位 完全脱离文档流