9.10CSS笔记

复习{
CSS: Cascading Style sheets 层叠式样式表
    作用: 修饰html页面，标签，可以添加颜色，宽高， 状态
    
    使用方式: 
        1.行内写法
        2.内嵌写法   在head标签 使用style 标签 完成css 语法的定义
        3.外联写法   使用link标签，href 引入css样式     ，type="text/css"  rel="stylesheet"
    行内 > 内嵌 > 外联 
    
    学习Css的语法结构: 
       style="属性名: 值 ; 属性名: 值";
       使用选择器 选中所需要的标签， 添加样式
       
     选择器:  id选择器{}， 标签名{} , .class名{} , 层级选择器： + 兄弟 ， ~ 所有兄弟, > 所有子类  
              #id,div,.class
     
     伪类: 只针对 超链接 
        :hover{} 悬停
        :visited{} 访问过的
        :link{} 为访问的
        :active{}  
     
     盒子模型: 
         border：  边框
         margin： 外边距
         padding: 内边距
     
      定位: 绝对定位 absolute ，  相对定位 relative 必须同级元素
             
      浮动: float: left ，          
        
      text-align: center;
      margin: 0 auto;
}
===========================================================================
javaScript:   简称js ， 跟java一点关系没有
  纯前端的编程语言 ，脚本语言 ， 面向对象
  
  如何编写js代码：
      1.行内写法 
           <button οnclick="javascript:alert('哈哈')">登录</button>
      2.内嵌  
           <script type="text/javascript">
               alert("Hello JavaScript");
           </script>
           
      3.外联
      
      js代码一定要结合HTML编写 ， 在html标签中 使用script标签
           例如:  <script> </script>
  
javaScript划分:
   1.js基础：
       |-- 关键字: 在javaScript中具有特殊含义的单词就是关键字
                    var ， abstract ，new ， else ，if , for, break, return ...
       |-- 标识符: 由26英文字母， 0-9数字， $ ,_组成的字符
                   不可以用数字开头，
                   不可以是纯数字，可以包含数字，
                   不可以由空格
                   不可以是关键字， 但可以包含关键字
                   驼峰式命名
       |-- 变量: 
              a = 3;
       |-- 数据类型:                                        
            基本数据类型: number ，string ,boolean ,undefined, null
            对象类型: object , array  ,date
       
            alert(typeof age);  查看当前对象类型
       
       |-- 运算符:
             算数运算符: + ,- , * , / ,% , ++ , --
             赋值运算符: = , += ,-=, *= ,/= ,%=
             比较运算符: >, < , >= ,<= , != , == (比较值) , === (比较值和类型)
             逻辑运算符: , && , || , ! 
             三目运算符:   ?       :        ;
        
     |-- 条件语句:    
             if(){}
             if(){}else{}
             if(){}else if(){}
             switch(){}
   
     |-- 循环: 
            1.for(var i = 0;i < arr.length; i++){
                alert(i);
            }
            2.while(){
                
            }
            3.do{
                
            }while();
            4.for(var i in a){         i 是下标
                alert(a[i]);
              }
    
    js函数(方法): 
        无返回值无参数:        
        function 方法名(){
            //方法体
        }
        无返回值有参数:
        function eat(food){
            alert(food);
        }      
        
        由返回值无参数:
        var result = function eat(){
            return "结果";
        }
        var a = result();
        alert(a);
                  
        有返回值有参数:
        var result = function(food){
            return food;
        }
        alert(result("结果"));          

高级部分: 
    Array对象: 
        1.属性: length 代表数组长度
        2.方法: 
             a.concat(b); 合并两个数组
             a.indexOf(value); 返回指定元素所在下标
             a.lastIndexOf();      
             Array.isArray(a); 判断是否是数组
      ***     join();将数组中的所有元素变成字符串 var b = a.join();
             pop(); 删除数组的一个元素
             push(); 向数组的最后一个位置添加一个元素
             reverse();将数组反向输出
             sort(); 排序
             valueOf();
             toString();

***    Date对象: 
        date.getDay();星期几
        date.getMonth();月份
        date.getYear();年份
        date.getDate();几号
        date.getHours(); 小时
        date.getMinutes(); 分钟
        date.getSeconds(); 秒
        date.getMilliseconds(); 毫秒
    
    date.toDateString(); 将年月日部分变成字符串
    date.toTimeString();将时分秒部分变成字符串
    date.toString(); 将日期变成字符串
    
    toJSON(); 将日期转换为json格式
        json就是一种文本格式，用来传输数据的，一般用于 前台向后台，或后台向前台传输数据
    
    Number对象:
        Number.MAX_VALUE;
        Number.MIN_VALUE;
    
    String对象:
        属性: length
        方法:var a = charAt(1); 返回在指定位置的字符。
              concat(); 拼接
              endsWith(); 以...结尾
              startsWith();以...开头
              indexOf(); 返回指定字符第一次出现的位置
              lastIndexOf(); 返回指定字符最后出现的位置
              replace(oldStr,newStr); 替换
              split();将指定字符串 分割成数组
              substr();     截取
              substring(); 截取
              toLowerCase(); 将字符变成小写
              toUpperCase(); 将字符变成大写
              trim(); 去掉两边空格
              
    正则表达式: 
       1.java
       2.javaScript
        
        验证 邮箱格式
        输入用户名: 字母开头， 包含数字，
        
        RegExp:  Regex正则 Expression表达式
         
        var a = new RegExp(pattern, modifiers);
        var a = /正则表达式/;
        
    []方括号:
        [abc]代表abc字母的任意一位
        [a-z]代表a到z 的所有字母 任意一位
        [^abcdef] 处理 括号中的 字符，都可以， 任意一位
        [0-9] 代表0-9的数字  
        [^1234]
        
    元字符:
        \w 匹配字母 ，数字， 下划线 _
        
        \W 除了字母， 数子， 下划线，匹配 @ ，% ，* 特殊字符
        
        \d 匹配数字
        
        \D 匹配非数字
        
        \s 查找空白字符     
        
        \S 查找非空白字符
        
        \t 制表符
        
        \n 换行符
        
        \r 回车
        
    量词: 
      n+:  /a+/ 至少一个a ，最多n
      n*:  /a+/ 包含0个 或 多个
      
      n{x} 固定x次
      n{x,} 至少x次，最多无限
      n{x,y}  直到x， 最多 y次
         
    正则表达式.test(字符串值); 如何匹配就返回true ，否则是false
    正则表达式.exec(字符串值); 如果匹配就返回字符本身，否则返回null；
    
    
    
    var str = /[a-zA-Z0-9]{3,20}/;
        
        
              
             
   2.DOM编程：Document Object Model     文档对象模型
   3.BOM编程：Browser Object Model  浏览器对象模型