【JS】基础

1、定位
#position属性
   static（默认）
   Relative ：设置距离是指在原来文档流的位置处做偏移
   Fixed（脱离文档流）
   Absolute（脱离文档流）
#与top,left,bottom,right连用
   top元素顶端与距离“浏览器”上边缘的距离
   left元素顶端与距离“浏览器”左边缘的距离
   bottom元素顶端与距离“浏览器”下边缘的距离
   right元素顶端与距离“浏览器”右边缘的距离
#绝对定位默认是以浏览器作为参考，但是如果绝对定位在relative定位的元素中（绝对定位中也行），那么就以这个元素作为参考。
#绝对定位中位置的层次
z-index

2、display显示与隐藏以及设置显示样式
   none，block（块），inline(行级)
   div（块级标签，占满一整行），span（行级标签）
3、JavaScript
   基础语法
   DOM（文档对象模型）
   BOM
   jQuery(DOM、BOM)
   js高级

4、JavaScript基础
   #基本历史和现状
   ->1994-1995，点击一个网页，需要40s左右才能打开
   注册的问题
   ->就是为了检验页面中的数据
   网景：livescript，1995年sun的java火了，更名为JavaScript
   微软ie绑定到操作系统中（JavaScript语言）

   #JS
   Ecma-v3
   Ecma-v5 严格模式 strict
   历史分歧，使得JavaScript的多面化
   执行在浏览器上的一个脚本语言
   Flex:actionscript (js是变种)
   Node.js(v8引擎作为js的解释引擎，将js带到了服务器后端)
   Nginx
   commonJS
5、库
   jQuery
   Prototype
   YUI
   Extjs
   Dojo

6、JavaScript的数据类型
#基本类型：数字类型，布尔类型，字符串类型
#引用类型：对象类型，函数类型，
#空类型：null ，undefined
#运算符：typeof
语法：string typeof (变量)；

7、JavaScript是一个弱类型的语言
   弱类型不代表没有类型，不严格的检查类型
   C# int num =10; //需要检查类型赋值，如果不符合要求就报错，编译不通过
   在JavaScript中：使用var声明变量，var num=123;   //不会检查任何类型，任何赋值都可以成功

8、运算符
   数学运算符：+-*/
   逻辑运算符：><=!=
                          ===    &&   ||
   与对象相关
   New
   Delete
   Instanceof

9、逻辑控制与流程控制
IF：

 If(bool表达式)
    {
        语句
    }
    Else if(bool表达式)
    {
        语句
    }else{
        语句
    }

解释性的语言，规范结尾用分号，不用分号也不会报错，js引擎会根据换行自动加分号

 switch-case：
        Switch(val){
            Case 值1：语句；break；
            Case 值2：语句；break；
            Case 值3：语句；break；
            … …
            Case 值N：语句；break；
            default：语句；break；
        }

while：
        while（逻辑表达式）{
            循环体
        }

   do-while：
        Do{
            语句
        }while（条件）；

for：
        for（var i=0;i<max;i++）
        {
            循环体
        }

   #for-in结构（有点像foreach，但是不同）
       For(var item in 集合或对象){
           遍历这个集合对象，item为每一个项的值
           循环体
       }
   栗子：

 <!DOCTYPE html>
    <html>
    <head>
        <meta charset="utf-8" />
        <title></title>
        <style type="text/css">
    
        </style>
        <script type="text/javascript">
            //遍历数组
            //var arr = [2, 3, 4, "abc", true];  //字面值
            //for (var item in arr)
            //{
            //    console.log(arr[item]);
            //}
            //遍历键值对（json）
            var kv = {
                "key1": "sophia",
                "key2":"jason"
            };
            for (var key in kv) {
                console.log(kv[key]);
            }
    
        </script>
    </head>
    <body>
    
    </body>
    </html>

猜你喜欢