Web前端技术个人学习经验总结

目录：
    1.2017-12-24（第一天Web项目）：
    2.2017-12-25（第二天表格）：
    3.2017-12-25（第二天框架及表单）：
    4.2017-12-26（第三天CSS语言）：
    5.2017-12-28（DIV+CSS）：
    6.2017-12-29（JavaScript）:
    7.jQuery:
    8.表单验证+正则表达式+BootStrap:
    9.Web杂碎知识总结：
    10.Web前端（对象+属性+事件）总结：




-------------------》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》2017-12-24(第一天Web项目)：

1.飞秋（局域网通信软件）---需要关闭防火墙---在控制面板---系统和安全
2.DeskTopShare(屏幕共享)
3.Hbuilder（代码编辑器）

专业删除软件方法---（控制面板）中添加和删除软件（为了删除注册信息，防止卸载后可以重新安装）

买一台阿里云服务器（一个月9.9）
小项目：
        全网最强翻译系统；




    
        
        
        
        
    
    
        

            
            

                
1. 项目一
                       
      
                           
   • 项目1
   
                           
   • 项目2
   
                           
   • 项目3
   
                       
   
                   

                
2. 项目二
                       
       
                           
   1. 项目1
   
                           
   2. 项目2
   
                           
   3. 项目3
   
                       
   
                   

            

        

        

            
            

                
• 项目一

                
• 项目二

                
• 项目三

            

        

        

标题内容1（链接文本或图像）

        

标题内容2（链接文本或图像）

        

标题内容3（链接文本或图像）

        

标题内容4（链接文本或图像）

        

标题内容5（链接文本或图像）

        

标题内容6（链接文本或图像）

        

            段落内容
        

        

            段落内容
            
            段落内容
            段落内容
            段落内容
            

            段落内容
        

        

---

        

黑天鹅出版社

    



                    
                        
                        
                        
                        
                        
                        
                    
                    
                        
                        

                        百度翻译
                    
                
标签
    text和bgcolor属性
    background属性
    link、alink和vlink属性
     代表空格
    size属性默认为3
    颜色表示形式：
                1.英文单词：red、yellow、black,紫色porple等等；
                2.rgb（红，绿，蓝）不同的浏览器对rgb的值表示不同；
                3.十六进制的数，例如“#FF0000”替
    

            margin:上下边距；width：左右边距

注释标签
    
    /*这是使用到CSS中的
    
    
        

            使用前端技术展现WEB系统
        

        

            JAVA语言基础与面向对象编程实践
        

        

            JAVA WEB技术综合应用        
        

    

-------------------------------------------------------------------------------

CSS是辅助HTML的一门语言
    CSS可以用来修饰标签，使其美观！！！（化妆师）

一、CSS使用
    

        百度
        搜狐
        

            百度音乐
        

    

    2.（找到他所有的名字为a的孩子---所有的孩子）---其中a可以使标签名、ID名已经类名
    
五、并集选择器
    p1,p2,p3,p4{
        color:red;
    }


其中id和class的内容由字母、数字和下划线组成，但是首字母不能是数字
当代码中对一个标签同时使用三种修饰方式时：（有优先级）
    ID选择器>类选择器>标签选择器
三种同时作用时相同的属性覆盖，不同的属性合并（按照优先级进行操作）

    .c1,p1,p2{
        （这些属性可以同时作用于所对应的三个标签）
    }

/**/是标签放到标签中
    
        
    
2.内联样式表：（将内容和样式混合起来，失去了CSS样式表的灵活性和复用性，不推荐使用）
    放到标签内部
        

段落

3.外部样式表：
    新建一个后缀名名为css的文件，然后将修饰样式信息写到该文件中；然后在代码html代码中的标签中加入
    
        
    

三种样式表也是有优先级的：（就近原则--谁离标签最进先用谁!）


    
    
        

            百度
            搜狐
            新浪
            网易
            360
            12306
        

    
    


------------------------------------------------------------------------------

所有的标签都具有盒子模型！

页面布局：
    DIV+CSS


    
        
        
        
    
    
        

        

    


BOX模型是实现DIV+CSS的基础：
    边框：border;
    内边距：padding;
    内容、外边距：margin;
    宽和高属性等






一、做导航栏：
    1.设置外边距时，为了使能够自动居中等等可以使用auto
        margin:上  右  下  左（默认顺序四个值）
        margin:上下   左右（默认顺序两个值）
        margin-top:
        margin-left:
        margin-right:
        margin-bottom:

    2.链接状态：（超链接属性（可以应用到任何的标签），我们学习过通过调整标签的link、alink和vlink这三个属性来改变未点击、鼠标按下和访问过之后链接文本的颜色）
    在CSS中，链接有如下四种状态：
    父元素 a:hover{-----------鼠标指针位于链接的上方时的状态
            属性：属性值;
    }

    父元素 a:link{-----------普通的、未被访问的链接时的状态
            属性：属性值;
    }

    父元素 a:active{--------链接被点击的时刻的状态
            属性：属性值;
    }

    父元素 a:visited{--------用户已访问的链接的状态
            属性：属性值;
    }
    3.让多个DIV出现在同一行：float（可以改变原先的布局方式，使其多个div出现在同一行）

div与浏览器的margin并不是每一个浏览器都有，有浏览器会自动将网页元素与屏幕边的距离为零



作业：做一个导航栏：牛掰音乐网

（Hypersnap---截图工具）


右击检查或者F12打开页面的开发者工具；
    然后打开手机界面显示：
        

            --------其中的display属性是让占一整行
        

块级元素会占一整行：
    

    

行级元素/行内元素：
    a  font      

行内元素可以转换成块级元素；
块级元素也可以转换成行级元素。

然后在页面中会显示音乐播放条：自带下载功能
放歌标签：
    需要先建立一个文件夹，然后放入音乐

    
    

        

            
• 在心里从此有个你
----点击时就会弹出警告框显示1.mp3
            

            
• <>/li>
          

    

    

        
    

    

    
    


------------》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》2017-12-29（JavaScript）：
******程序从上之下执行，注意代码的书写规范

1.JavaScript文件中不能包含标签；
2.任何值+字符串就变成了字符串；alret(a+"字符串");（其中a为变量，加入a=5）
    例如：alert(5+"5");浏览器显示结果为55；而alert(5+5);浏览器显示结果为10。
    console.log(5+"5");浏览器显示结果为55
3.

变量：(声明变量时用 var)
    1.变量类型：
        boolean = true/false
        null
    2.运算符：
        比较运算符的结果只能是true或false;
        == 只比较值是否相等；=== 比较值和类型是否相等。
            例如：5 == "5"结果是true;而5 === "5"结果是false

流程控制：
    1.顺序
    2.分支  
        （1）if--单分支/双分支/多分支
        （2）switch--if分支中多分支的缩减版
    3.循环



（不要为了迎合用户需求而随意修改代码！）
函数/方法：（封装）
    1.通过实践调用函数；（οnclick="函数名;"即通过点击事件调用函数）
    2.之间在标签中调用函数，浏览器会自动调用。


字符串的拼接：
    document.write("

---

");
    alert(变量+"+"+变量+"="+结果);{alert(5+"+"+5+"="+10);输出为：5+5=10}

prompt接收的值是字符串类型;prompt("请输入第一个值：","10");
parselFloat(变量);
parslInt(变量);只能转换成整数。
--------------------------------------------------------------

事件---内置对象---

javascript:(脚本：辅助作用)
    辅助HTML，不能单独使用


对象：    
    调用对象：方法、函数
------------------------------------------------------------------------------------------
var 变量名 = document.getElementById("标签的ID号");
变量.innerHTML="";(将原先的标签重新塑造)
变量.innerHTML=变量.innerHTML+"";（在原先标签的基础上令加新的内容（追加））
window.οnkeyup=function(e){                //其中e代表event
    var div1 = document.getElementById("div1");        //通过标签的ID号来在函数中调用标签
    var code = e.keyCode;                //键盘按键的编码值
    var temp = string.fromCharCode(code);        //将获取的键盘编码值转换成字符
    var small = temp.toLowerCase();                //将字符转换成小写
    div1.innerHTML = "";                        //修改标签内容
//    div1.innerHTML = div1.innnerHtml+"";        //追加标签内容
}
console.log("");    //打出日志---浏览器页面右键检查选择console


事件：
    1.onclick:鼠标点击触发事件；
    2.onmouseover:鼠标移入触发事件；
    3.onmouseout:鼠标移出触发事件；
    4.onmousemove:鼠标移动触发事件；
    5.onmousedown:鼠标按下触发事件；
    6.onmouseup:鼠标抬起触发事件；
    7.onkeyup:键盘抬起触发事件(键盘上的任意键)；----window.οnkeyup=function(){}
    8.onkeydown:键盘按下触发事件（键盘上的任意键）；
    9.onload:加载页面后触发事件；
    10.onbeforeunload:关闭页面触发事件；----IE浏览器支持，Google不支持
    11.onfocus:获取焦点触发事件(光标移入)；
    12.onblur:失去焦点触发事件（光标移出）；
    13.onchange:内容更改触发事件；
    14.ondbclick:双击触发事件；
    15.onkeypress:键盘敲击事件；
（调用函数时在函数的参数里写this，然后在原来函数定义的位置传入一个参数----可以将调用该函数的标签传入被调用的函数；而且在函数中可以通过改变来调用该标签的元素及修改其属性）
......



    

        
    

JS调错：
    页面右键-检查--console
-------------------------------------------------------------------------
DOM对象：
    1.浏览器把HTML文档的元素转换成节点对象，所有节点组成了一个树状结构；
    2.把这些节点对象按照一定顺序绘制到浏览器窗口中；
    3.以对象描述文档的方式就是DOM；
    4.节点对象就被称为DOM对象。
基础DOM：
    1.元素节点：文档中的所有元素；
    2.文本节点：元素节点内的文本元素；
    3.属性节点：元素节点的子节点。
var element = document.getElementById("ID号");    //根据ID号获取一个元素，并且得到该元素对象
var element = document.getElementsByName("标签的name属性值");        //根据name属性来获取元素。得到符合条件的所有元素（数组）
var element = document.getElementsByTagName("标签名字");        //根据标签名来获取元素，并且得到符合标签名的所有元素（数组）

可以在JavaScript中调用节点（元素节点、文本节点、属性节点）来设置属性以及修改属性值；
节点.setAttribute();

------------------------------------------------------------------------
内置对象：-----（通过对象内置的方法来实现一定的功能）
    1.String对象：
        charAt(index):返回在指定位置的字符;
        charCodeAt(index):返回在指定位置的字符的Unicode码;
        concat(string1,string2,...,stringN)：连接字符串；使用方法：例如:document.write("abcd".concat("efg"));既可以在浏览器中输出abcdefg;
        indexOf(searchvalue,fromindex):检索字符串searchvalue的位置;
        split(separator,num):把字符串分割为字符串数组，num表示返回的数组的最大长度;
        substr(start,num):从起始索引号提取字符串中指定数目的字符;
        substring(start,end):提取索引号起始位置到结束位置的字符串的子串（不接受负的参数）不包含end处的字符;
        replace(oldvalue,newvalue):替换子字符串值;
        toLowerCase():把字符串转换为小写;
        toUpperCase():把字符串转换为大写;
        fromCharCode(num1,num2,num3,....,numN):有一系列字符编码创建一个字符串。
    2.Data对象：（Date用来处理日期和时间---设置/获取/显示日期和时间）
        var 变量名 = new Date();
        setInterval("函数名",秒数（数字）):定时函数，每个指定的时间，执行指定的函数;
        获取和设置日期：
            toUTCString:
            setFullYear(年，月，日):
            setHours(小时):
            setMinutes(分钟):
            setSeconds(秒):
        显示动态时间：
            通过将当前的时间封装成函数/方法;
            setTimeout('函数/方法',时间):----设置多长时间调用一次函数/方法;
    3.Math对象：
        abs(x):返回数的绝对值;
        acos(x):返回数的反余弦值;
        asin(x):返回数的反正弦值;
        atan(x):返回数的反正弦值;
        atan2(y,x):
        ceil(x):对数进行上舍入;
        cos(x):返回数的余弦;
        exp(x):返回e的指数;
        floor(x):对数进行下舍入;
        log():
        max():
        min():
        pow():
        randow():返回0-1之间的随机数;
            返回1-100之间的随机数：var temp = Math.random();var Num = 1+Math.floor(100*temp);
            返回50-100之间的随机数：var temp = Math.random();var Num = 50+Math.floor(50*temp);
        round(x):把数四舍五入为最接近的整数;
        sin(x):返回数的正弦值;
        sqrt(x):返回数的平方根;
    4.Number对象：(Number对象是原始数字的包装对象)
        var myNum = new Number(value);
            -其中value是要创建的Number对象的数值;
            -可以省略new关键字;
        属性：
            MAX_VALUE：
            MIN_VALUE:
            NAN：表示非数字值;
            NEGATIVE_INFINITY:负无穷大,溢出时返回该值;
            POSITIVE_INFINITY:正无穷大，溢出时返回该值;
        方法：
            toFixed(num):保留几位小数，按指定小数位数num四舍五入;
            toString(radix):把数字转换成字符串，radix表示进制数，例如2、8、10、16，省略时数默认值是10;
            toExponential(num):把对象的值转换成指数计数法，小数点之后有num位数字;
            toPrecision(num):把数字格式化为指定的长度，如果num数足够大，采用定点计数法，不够大的话，则采用指数计数法;
            valueOf():返回一个Number对象的基本数字值;
    5.Array对象：
        ---JS中，Array对象代表数组
        ---创建Array对象的语法为：    
            new Array();
            new Array(size);
            new Array(element0,element1,......,elementN);
--------------------------------------------------------------------
JavaScript数组：
    Array():创建数组对象的方法;
        var arrs = new Array(个数);创建数组对象空间大小为5
        var arrs = Array("12","13","14");----进一步可以进行追加：arrs.push(15);
        var arrs = new Array();-----追加：arrs[0]=11;arrs[1]=12;arrs[2]=13;
    sort():对数组元素进行排序-但是排序是按变量的第一个首字母的字符顺序进行排序的;
    reverse():逆序对数组元素进行排序，同样是按照数组元素的第一个首字母的字符顺序的逆序进行排序;
    concat():连接两个或更多的数组，返回新的数组;
    join("分隔符")方法:用于把数组中的所有元素连接成一个字符串，并通过分隔符进行隔开;
    pop():删除并返回数组的最后一个元素;---返回之后将会删除数组中的返回的数组元素;
    shift():用于返回数组中的第一个元素，返回后将删除数组中的返回的数组元素;
    push():向数组的末尾添加一个或多个元素，同时返回当前数组的长度;
    unshift():可向数组的开头添加一个或更多元素，并返回新的长度;
    slice():从已有的数组中返回选定的元素;
    splice():向/从数组中添加/删除项目，然后返回被删除的项目，在添加时数组本来的元素会自动移位；splice(1,0,"nihao")----从数组下标为1开始删除0个数组元素，同时在下标为1的位置插入元素（"nihao"）;

---------------------------------------------------------------------------
Dom高级：
    Node对象：
        Node对象是整个DOM的主要数据类型,节点对象代表文档树中的一个单独的节点;
        cloneNode();里面可以有参数，当参数为true时，将不仅复制节点本身，而且还会复制其子节点;
        常用方法：
            childNodes:返回节点的子节点的节点列表;
            firstChild:返回节点的首个子节点;
            lastChild:返回节点的最后一个子节点;
            parentNode:返回节点的父节点;
            nextSibling:返回节点之后紧跟的同级节点;
            previousSibling:返回节点之前紧跟的同级节点;
            nodeName:返回节点的名称,根据其类型;
            nodeType:返回节点类型;
                nodeType属性：
                    元素节点      节点类型值(nodeType)
                    元素element        1
                    属性attr           2
                    文本text           3
            nodeValue:设置或返回节点的值，根据其类型;
        常用方法：
            createElemnet():创建元素节点;
            createAttribute():创建属性节点;
            appendChild():向节点的子节点列表的结尾添加新的子节点;
            cloneNode():复制节点;
            insertBefore():在指定的子节点前插入新的子节点;
            removeChild()：删除（并返回）当前节点的指定子节点;
            replaceChild():用新节点替换一个子节点;
            getAttribute():返回指定的属性值;
            setAttribute():把指定属性设置或修改为指定的值;

    Table对象：
        集合：
            rows[]:包含表格中所有的一个数组（包含、和中定义的所有行）;
            cells[]:包含表格中所有单元格的一个数组;
        属性:
            id：表格id;
            caption:对表格的元素的引用;
        方法：
            insertRow(index):在表格指定的索引处插入一个新行;
            deleteRow(ityyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyndex):从表格删除一行;

    TableRow对象：
        集合：
            cells[]：包含该行中的所有单元格的一个数组;
        属性：
            id:该行id;
            innenrHTML:行的开始标签和结束标签之间的HTML;
            rowIndex:该行在表中的位置;
        方法：
            insertCell(index):在一行的指定位置插入一个空的td元素;
            deleteCell(index):删除行中的指定元素的单元格;
    TableCell对象：
        属性：
            id:单元格id;
            innerHTML:单元格的开始标签和结束标签之间的HTML;
            cellIndex:单元格在某行的单元格集合中的位置;
    Select对象：
        属性：
            disable:设置或返回是否应禁用下拉列表;
            length:返回下拉列表中的选项数目;
            multiple:设置或返回是否选择多个项目;
            name:设置或返回下拉列表的名称;
            selectedIndex:设置或返回下拉列表中备选项目的索引号;
            size:设置或返回下拉列表中的可见行数;
    Option对象：
        属性：
            disabled:设置或返回选项是否应被禁用;
            index:返回下拉列表中某个选项的索引位置;
            selected:设置或返回selected属性的值;
            text：设置或返回某个选项的纯文本值;
            value:设置或返回被送往服务器的值;

-------------------------------------------------------
变量：
    全局变量：
        从定义开始到页面结束为止;
    局部变量：
        从定义位置到函数结束为止;


-------------------------------------------------------
BOM--浏览器对象模型--提供与浏览器窗口进行交互的对象，使用BOM可以访问和操作浏览器窗口;
    window对象(当前浏览器所在的页面):---所有window对象的属性和方法自动成为JavaScript全局变量和全局函数
        属性：
            document:
            location:
            history:
            navigator:
            screen:
            name:
            opener:
            parent:
            self、window:
            status:
            screenLeft、screenTop:
        方法：
            close():
            open(URL,name,feature,replace):
            alert(message):
            confirm(message):
            prompt(text,defaultText):
            moveTo(x,y)：
            moveBy(x,y):
            resizeBy(width,height):
            resizeTo(width,height):
            focus()、blur():
            setTimeout(code,millisec)、clearTimeout(sid):
            setInterval(code,millisec)、clearInterval(sid):

------------》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》jQuery：
1.jQuery简介：
    *jQuery是JavaScript程序库/函数库（对JavaScript对象及函数的封装），jQuery已经成为最流行的JavaScript框架。
    **jQuery是一个兼容多浏览器的JavaScript框架。
    ***jQuery是免费、开源的，其语法设计可以让开发者觉得使用起来更加便捷。
    ****$(function(){该函数/方法的内容});---定义一个jQuery函数/方法，是$(document).ready(function(){该函数/方法的内容});的简写。
2.jQuery对象：
    *DOM（文档对象模型简称）只有（X）HTML、XML等文档结构的语言才具有DOM；DOM中的节点分为三种：元素节点、属性节点和文本节点。
    **通过jQuery选择器选中的HTML元素，就是jQuery对象。
        应用：var myHtml = $("#myId").html()---使用jQuery对象的html()方法，等价于document.getElementById("#myId").innerHTML;
    ***DOM和jQUERY对象之间的转换：DOM对象和jQuery对象的方法/属性是彼此独立的，但是在某些情况下，如果一定要用DOM对象来调用jQuery对象的属性/方法，或者要用jQuery对象来调用DOM对象的属性/方法，就必须进行DOM对象与jQuery对象之间的类型转换。
        （1）将DOM对象转换为jQuery对象：将一个DOM对象用$()包裹起来，就可以转换成一个jQuery对象，即$(DOM对象)就是一个jQuery对象。其中，$()称为jQuery工厂。
--------（2）将jQuery对象转换为DOM对象：jQuery对象的本质是一个类似数组或集合的对象，而DOM对象的本质是一个普通的对象。因此，jQuery对象转换为DOM对象的额本质，就是将一个数组或集合转为一个普通对象。
            方式一：将jQuery对象看成一个数组，通过使用数组下标的方式转为DOM对象；
                var $jqueryObject=$("#myId");//获取jQuery对象
                var jsObject=jqueryObject[0];//通过数组下标的方式，将jQuery对象转换为DOM对象
            方式二：将jQuery对象看成是一个集合，通过使用get(index)的方式转为DOM对象；
                var $jqueryObject=$("#myId");//获取jQuery对象
                var jsObject=jqueryObject.get(0);//通过get(index)的方式，将jQuery对象转换为DOM对象

3.jQuery选择器：（jQuery的大部分功能都依赖于选择器---选择器是jQuery的根基）
    类CSS选择器：
        *基本选择器:
            标签选择器：
                $("HTML标签名")---根据给定的标签名匹配元素，例如：$("h1")--选取所有的h1元素。
            类选择器：
                $(".class名")---根据给定的class匹配元素，例如$(".content")--选取所有class="content"的元素。
            ID选择器：
                $("#id值")---根据给定的id匹配元素，例如：$("#myTitle")--选取id="myTitle"的元素。
            并集选择器：
                $("选择器1，选选择器2")---将多个选择器用逗号分隔开取并集，例如：$("div,.title")--选取所有div和拥有class="title"的元素。
            交集选择器：
                $("选择器1选择器2")---将多个选择器连续书写，取交集，例如：$("div.title")--选取所有拥有class="title"的div元素。
                注意：和使用交集选择器时，除了"选择器1"以外的其他选择器不能是标签选择器（为了防止歧义）
            全局选择器：
                $("*")---匹配所有的元素，例如：$("*")--选取所有元素。
        *层次选择器：（通过DOM元素之间的层次关系来获取元素，（对于后代选择器）当后面的元素为.名字时中间可以不加空格）
            相邻元素选择器：
                $("选择器1+选择器2")---选择紧邻选择器1所选元素之后的选择器2所有的元素（最多只选中一个元素），例如：$("h1+div")--选取紧邻

元素之后的同辈元素

            同辈元素选择器：
                $("选择器1~选择器2")---选取选择器1所选元素之后的选择器2所选的所有元素，例如：$("h1~div")--选取

元素之后所有的同辈元素

。
            后代选择器：
                $("选择器1  选择器2")---选取选择器1所选元素内的（后代）选择器2所选的所有元素，例如：$("#title  span")--选取#title中的所有元素。
            子选择器：
                $("选择器1>选择器2")---选取选择器1所选元素内的（子代）选择器2所选的元素，例如：$("#title>span")--选取#title的子元素
        *属性选择器：（属性选择器通过HTML的属性来选择元素）（使用时配合交集/并集等选择器一起使用来缩小查找范围）
            $([属性名])---选取包含特定属性的元素，例如：$("[name]")--选取所有含有name属性的元素；$("div[class]")---找到div标签下含有class属性的元素。
            $("[属性名=属性值]")---选取属性值是某个特定值的元素，例如：$("[name='stuName']")选取name属性值为stuName的元素。
            $("[属性名!=属性值]")---选取属性值不等于某个特定值的元素，例如：$("[name!='stuName']")--选取name属性值不等于stuName的元素。
            $("[属性名^=属性值]")---选取属性值以某些特定值开头的元素，例如：$("[name^='stu']")--选取name属性值以stu开头的元素。
            $("[属性名$=属性值]")---选取属性值以某些特定值结尾的元素，例如：$("[name$='me']")--选取name属性值以me结尾的元素。
            $("[属性名*=属性值]")---选取属性值包含某些值的元素，例如：$("[name*='na']")--选取name属性值中含有na的元素。
    过滤选择器：（通过过滤规则来筛选元素，语法特点是使用":"作为过滤选择器的标识符）
        *基本过滤选择器：（可以选取第一个元素、最后一个元素、索引为偶数或奇数的元素或根据索引选取元素）
            :first---选取第一个元素，例如：$("li:first")--选取所有

元素中的第一个

元素。
            :last---选取最后一个元素，例如：$("li:last")--选取所有

元素中的最后一个

元素。
            :even---选取索引是偶数的所有元素（从0开始），例如：$("li:even")--选取索引是偶数的所有

元素。
            :odd---选取索引是奇数的所有元素（从0开始），例如：$("li:odd")--选取索引是奇数的所有

元素。
            :eq(index)---选取索引等于index的元素（从0开始），例如：$("li:eq(1)")--选取索引等于1的

元素。
            :gt(index)---选取索引大于index的元素（从0开始），例如：$("li:gt(1)")--选取索引大于1的所有元素（不包括1）。
            :lt(index)---选取索引小于index的元素（从0开始），例如：$("li:lt(1)")--选取索引小于1的所有元素（不包括1）。
            :not(选择器)---选取指定选择器未选中的元素，例如：$("li:not(#myTitle)")--选取id值不是myTitle的

元素。
            :header---选取所有标题元素，如h1~h6，例如：$(":header")--选取网页中所有标题元素。
            :focus---选取当前获取焦点（光标）的元素，例如：$(":focus")--选取当前获取焦点的元素。
        *可见性过滤选择器：（disable属性值为none时会隐藏）
            :visiable---选取所有可见的元素，例如：$(":visiable")--选取所有可见的元素。
            :hidden---选取所有隐藏的元素，例如：$(":hidden")--选取所有隐藏的元素。
                应用：$("p:hidden").show()表示将所有隐藏的

元素的状态变为显示;$("p:visiable").hide)()表示将所有可见的

元素的状态变为隐藏。
        *属性过滤选择器：（value值两边可以加单引号也可以不加）
            [attribute]---匹配含有给定属性的元素；
            [attribute=value]---匹配含有属性=value的元素；
            [attribute!=value]---匹配含有属性但！=value的元素；
            [attribute^=value]---匹配属性值是以value开始的元素；
            [attribute$=value]---匹配属性值是以value结束的元素；
            [attribute*=value]---匹配属性值包含某些值的元素，部分前后，中间有也算；
            [selector][selector]---匹配属性选择器的交集；
    表单对象选择器：（

）
        :input---获取所有的表单元素开头的，还有textarea、select。
        :text---获取所有的单行 文本框。
        :password---获取所有的密码框元素。
        :radio---获取所有的单选按钮。
        :submit---获取所有的提交按钮
        :image---获取所有的图像按钮
        :reset---获取所有的重置按钮
        :button---获取所有按钮
        :file---获取所有的文件上传框
        :enabled---获取表单中所有可用的元素。
        :disabled---获取表单中所有不可用的元素。
        :checked---获取表单中所有被选中的元素。
        :selected---获取表单中所有被选中的option元素。
        
4.jQuery文档操作：(如果存在参数content，表示给选中的元素赋上新的内容content；如果不存在参数content，表示获取被选中的元素内容)
    *对HTML代码的操作：jQuery可以使用html()方法对元素的HTML代码进行操作，该方法类似于JavaScript中的innerHTML。
        jQuery对象.html(content)---会将内容先渲染成html/css样式，然后再赋值给元素。
    *对文本内容的操作：jQuery可以使用text()方法获取或设置元素的文本内容。
        jQuery对象.text(content)---只是简单的以文本形式赋值给元素。
    *对value值的操作：jQuery可以通过val()方法获取或设置元素的value值。
        jQuery对象.val(参数)---如果存在参数V，表示被选中元素的value值设置为V；如果不存在参数V，表示获取被选中元素的value值。
    *对属性的操作：    jQuery主要通过attr()和removeAttr()方法来对节点的属性进行操作。
        （1）获取或设置属性值：
                attr("name")---获取单个属性值。如$(A).attr("name"),表示获取A节点的name属性；
                attr("name","value")---设置单个属性。如$(A).attr("name","张三")，表示将A节点的name属性值设置为value；
                attr({name1:"value1"},{name2:"value2"},.......{nameN:"valueN"})---同时设置多个属性值。如$(A).attr({width:"50",height:"100"})
        (2)删除属性值：
                removeAttr("name")---删除属性值。如$(A).removeAttr("alt"),表示删除A节点的alt属性值。
    *元素节点的操作：
        （1）查找节点：
            查找节点通过jQuery选择器实现。
        （2）创建节点：
            $()成为工厂函数，可以用于获取节点、转化节点或创建节点；
            $(选择器)：通过选择器获取节点；
            $(DOM节点)：把DOM节点转化成jQuery节点；
            $(HTML字符串)：使用HTML字符串创建jQuery节点。
                例如：var $node=$("

橘子

");（创建了一个新的节点）
        （3）插入节点：节点创建完毕后，就可以插入到DOM文档中。
            内部插入：
                $(A).append(B)---将B追加到A中；
                $(A).appendTo(B)---将A追加到B中；
                $(A).prepend(B)---将B前置插入A中；
                $(A).prependTo(B)---将A前置插入B中。
            外部插入：
                $(A).after(B)---将B插入到A之后；
                $(A).insertAfter(B)---将A插入到B之后；
                $(A).before(B)---将B插入A之前；
                $(A).insertBefore(B)---将A插入B之前。
        （4）替换节点：
            $(A).replaceWidth(B):用B节点替换A节点；
            $(B).replaceAll(A)：用B节点替换A节点。
        （5）删除节点：（jQuery提供了三种删除节点的方法：remove()、detach()、empty()）
            $(A).remove():彻底删除A节点，包括所有子节点及文本内容；
            $(A).detach():将A节点从页面删除，但仍然保留A节点附加的数据、绑定的事件。（此方法不建议使用）
            $(A).empty():清空A节点，包括所有子节点。（只清除节点的内容，而不真正地删除节点）
        （6）复制节点：jQuery提供的clone()方法，可以对节点进行复制操作（包括复制子节点、文本和属性）
            $(A).clone([flag])---可选参数flag为布尔值true或false，为true时表示会复制节点的所有事件处理方法；为false时反之。默认为false。
5.jQuery事件：（事件是指可以被控件识别的操作，每个控件都有自己可以识别的事件。jQuery事件是对JavaScript事件的封装，大体上可以分为基础事件和复合事件。注意：事件是实现网页与用户交互的基础）
    *基础事件：
        （1）window事件：
            当用户执行某些会影响浏览器的操作时而产生的事件。例如：第一次打开网页时的加载页面、关闭窗口、移动窗口、调节窗口大小等操作引发的事件。jQuery中最常用的window事件是文档就绪事件（即当页面中的DOM元素全部加载完毕时所触发的事件，该事件对应的方法就是ready()）。
        （2）鼠标事件：
            click():单击鼠标时触发的事件方法；
            mouseover():鼠标悬浮在某个元素上时触发的事件方法；
            mouseout():鼠标移出某个元素时触发的事件方法。
        （3）键盘事件：
            keydown():按下键盘时触发的事件方法；
            keyup():释放按键时触发的事件方法；
            keypress():产生可打印的字符串时触发的事件方法。
        （4）表单事件：
            focus():获取焦点时触发的事件方法；
            blur():失去焦点时触发的事件方法。
    *绑定事件与移出事件：
        （1）绑定事件：
            绑定一个事件：jQuery对象.bind(type,[data],fn);
            绑定多个事件：jQuery对象.bind({type:fn,type:fn,......,type:fn});
                事件参数：
                    type:事件类型，如click、focus、mouseover等，还可以是自定义事件；
                    data:可选类型，可以作为event.data的属性值，传递给事件对象额外的数据；
                    fn:处理数据，用来绑定该事件的处理函数。
        （2）移除事件：(使用unbind()方法为元素移除一个或多个事件)
            jQuery对象.unbind([type],[fn]);
                参数：
                    type:事件类型,如click、focus、mouseover等，还可以是自定义事件；
                    fn:处理函数，用于解除绑定的事件函数。
                当unbind()不带参数时，表示移除绑定的全部事件。
    *复合事件：
        （1）hover():（hover()方法相当于mouseover()和mouseout()方法的组合）
            jQuery对象.hover(fn1,fn2)
                其中，fn1相当于mouseover(),fn2相当于mouseout()。
         （2）toggle():(适用于jQuery1.9以前版本)
             jQuery对象.toggle(fn1,fn2,......fnN)
                 在jQuery以前版本，可以使用toggle()方法模拟鼠标连续的click事件：第一次单击元素时，触发第一个事件方法fn1；第二次单击元素时，触发第二个事件方法fn2......当最后一个事件方法fnN触发完后，若再次单击，就又会触发第一个事件方法fn1,如此循环调用。（自动判断当前的对象是显示还是隐藏，多次点击时，如该对象已经显示则隐藏，反之亦然）

6.jQuery动画效果：
     *隐藏、显示和切换：
         jQuery对象.hide():隐藏该对象；
         jQuery对象.show():显示该对象；
         jQuery对象.toggle():在显示和隐藏之间进行切换；
     *淡入、淡出和切换：
         jQuery对象.fadeIn("时间",函数):淡入；
         jQuery对象.fadeOut():淡出；
         jQuery对象.fadeToggle():在淡入和淡出之间进行切换；
     *向下滑动、向上滑动和切换：
         jQuery对象.slideUp("时间"，函数):向上切换
         jQuery对象.slideDown("时间",函数):向下切换；
         jQuery对象.slideToggle("时间",函数):向上、向下切换；
     *停止、回调函数：
         停止函数基本语法：
             $(selector).stop(stopAll,goToEnd);
                 ---可选的stopAll参数规定是否应该清除动画队列，默认是false，即仅停止活动的动画。可选的goToEnd参数规定是否立即完成当前动画，默认是false，表示立即停止，不等待这个动画执行完毕。
                 ---提到的callback回调参数，回调函数就是在当前动画完全执行完成之后执行的函数。由于JavaScript语句是按顺序依次执行的，动画之后的语句可能会产生错误或页面冲突(为动画还没有完成)。为了避免这种情况发生，程序员可以采用参数的形式添加回调函数。
                     //在滑动动画执行完毕后弹出对话框，提示“段落滑动完毕”
                     $(document).ready(function(){
                         $("#flip").click(function(){
                             $("#panel").slideToggle(3000,function(){
                                 alert(:段落滑动完毕！);
                             });
                         });
                     });

 jQuery animate()方法用于创建自定义动画：
     语法：
         $(selector).animated({params},speed,callback);
         ---必需的params参数定义形成
         animate操作多个属性：
             animate({属性名:"属性值",属性名:"属性值",属性名:"属性值",......})
     jQuery:animated选择器:选取当前的所有的动画元素;
timepicker:true/false;打开或关闭时间选项;

CSS动画实现：

    @keyframe

8.jQuery对象的函数/方法：（使用jQuery操作CSS样式、操作文本域属性值内容以及操作DOM节点）
    上面列出的jQuery事件；
     jQuery对象.next():取得匹配元素后面紧邻的同辈元素;
     jQuery对象.prev():取得匹配元素前面紧邻的同辈元素;
     jQuery对象.siblings():取得匹配元素前、后的所有同辈元素;
     jQuery对象.closest():取得最近的匹配元素;
     
     jQuery对象.addClass():给当前jQuery对象增加一个类属性，以便于调用以该类名设置的属性，可以添加一个类属性或多个类属性---addClass(class1 class2 ... classN)或addClass(class);
     jQuery对象.removeClass():去除当前jQuery对象的已有的类名---removeClass("style")或emoveClass("style1 style2");
     jQuery对象.fisrt():找到该类元素的第一个元素；
     jQuery对象.toggleClass():实现addClass()和removeClass()之间的切换；
     jQuery对象.css("属性类型","value").css()---后面可以跟很多个.css属性，但是每个.css里面只能设置一个属性;
    jQuery对象.html()---可以对HTML代码进行操作，类似JS中的innerHTML，无参数时用于获取用第一个恶匹配元素的HTML内容或文本内容，有参数时设置所有匹配元素内容;
    jQuery对象.val()---可以获取或设置元素的value属性值；
    jQuery对象.children()---取得匹配元素的子元素集合；
    jQuery对象.text()---可以获取或设置元素的文本内容，当有参数时参数里面的所有内容都会当做文本来显示，无参数时是获取匹配元素的文本内容；
    jQuery对象.attr():获取或设置元素属性，
    jQuery对象.removeAttr():删除元素的属性，
     jQuery对象.
     jQuery对象.
     jQuery对象.
     jQuery对象.
     jQuery对象.
     jQuery对象.
     工厂函数$()用于获取或创建节点：

------------------------------------------------------------
 常见CSS操作：除了使用之前讲过的css()方法获取或设置CSS样式以外，还可以使用jQuery提供的CSS-DOM操作方法：
     height([value])
         height():获取元素的高度；
         height(value):设置元素的高度；
     width([value])
         width():获取元素的宽度；
         width(value):设置元素的宽度；
     offset([function(index,oldoffset)])
         offset():获取元素的top和left坐标；
         function([index,oldoffset])：设置元素的top和left坐标，其中参数index为元素的索引，oldoffset为当前坐标，该方法返回被选元素的新坐标；
     offsetParent():
         返回最近的祖先定位元素；
         定位元素指的是元素的CSS position属性被设置为relative、absolute或fixed的元素。
     scrollLeft([position])
         scrollLeft():获取滚动条的left偏移量；
         scrollLeft(position):设置滚动条的left偏移量。
     scrollTop([position])
         scrollTop():获取滚动条的top偏移量；
         scrollTop(position):设置滚动条的top偏移量。

 使用css()为指定的元素设置样式值：
     .css({"属性1"："value","属性2"："value",...})
     .css("属性1","value").css("属性2","value")
 --------------------------------------------------------------------

9.标签中的函数定义方法：
    1.function 函数名(){
            函数体；
    }
    2.var 变量名 = function(){
            函数体；
    }
    3.
    （直接给标签绑定一个事件，或者使用bind绑定一个或多个事件，或者在jQuery对象后边直接.函数(function(){}).函数(function(){}).函数(function(){})------即直接使用点"."来绑定多个事件给标签）

 10.复合选择器：
     即将不同种类的选择器相互结合使用。

 11.开发常用标签：
     图文混编：
     

         

放图片

         

         

     

     ---------------
     ---
     --------------
     ---其中placeholder属性是设置文本框显示文本，当输入时原先设置的文本自动消失，删除所有文本后文本显示。

-------------------------------------------------------------------
JSON对象：
    var JSON对象 = {}；
    var JSON数组 = [{},{},{},....,{}]；（数组中包含的是对象）

jQuery遍历：(index是遍历对象的索引，item当前被遍历的对象)---其中这两个参数是别名，可以改变别名，但是函数对应位置的别名的作用是一定的。
    $.each(json,function(index,item){

    });

JSON数据服务：
    知识：
        1.在页面上展示JSON格式数据；
        2.编制自己的JSON格式数据；

jQuery扩展：（一个插件就是一个.js文件）
    jQuery插件的开发：
        1.类级别的插件开发:（即给函数添加新的全局函数---相当于给jQuery本身添加方法）
            全局函数：
                jQuery.foo=function(){}
                jQuery.bar=function(){}
                添加多个全局函数
        2.对象级别的插件开发：（即给jQuery对象添加方法）


-------------》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》表单验证+正则表达式+Bootstrap:

表单验证：    
    onsubmit:提交事件；

-------------------------------
正则表达式：
    一个描述字符对象的对象,他有一些特殊的字符组成，表达一个特定的含义；
    RegExp对象表示正则表达式，他是 对字符模式匹配的强大工具；
    正则表达式定义：（附带参数i代表区分大小写--带i是区分大小写，反之是不区分大小写）
        var reg = /blue/i(区分大小写)
        var reg = /blue（不区分大小写）
        *区分大小写：
        *不区分大小写：
        *精确匹配：
        \w:代表了[a-zA-Z_0-9]（即字母大小写、数字以及下划线）
        +号:代表至少出现一次
        ^:代表以什么Wie开头
        $:代表以什么为结尾
        \d{个数N}代表0-9的数字出现N次
        [0-9]:代表0-9的数字，这种表达可以出现在正则表达式中进行匹配
        [a-z]:或 [A-Z]或[0-9]等：这个符号[]可以设置要出现的字符，符号里边放入想要匹配的字符
        .{个数N}:代表匹配N为任意字符的字符串
        .{起始M,结束N}:代表匹配长度M个到N个之间的任意字符串（包含M个和N个）
        .(点):匹配单个字符（不包括换行和行结束符）
        \.:代表.

    RegExp对象里面的方法：    
        RegExp对象.test():测试匹配的字符串里面是否包含有正则表达式里面的字符串；

正则表达式符号含义：
    [^字符]：匹配方括号里边给出的字符范围以外的字符
    [字符]：匹配方括号里边给出字符范围内的字符


    常用量词：
        m+:
        m*:
        m？:
        m{x}:

------------Bootstrap前端框架----------
Bootstrap网站:Bootstrap中文网
Bootstrap:是最受欢迎的HTML、CSS和JS框架，用于开发响应式布局、移动设备有限的WEB项目；它在jQuery的基础上进行了（一个框架、多种设备）
    ---提供了一套响应式、移动设备优先的流式栅格系统，随着屏幕或视口尺寸的增加，系统会自动分为最多12列（栅格系统用于通过一系列的行（row）与列（column）的组合来创建页面布局，可以将内容放入已创建好的布局中）
Bootstrap栅格系统:


-------------》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》Web杂碎知识点总结：
JavaScript知识点总结：
    (1)==和===的区别：
        当==两边的内容为字符串时，则比较字符串的内容是否相等;
        当==两边的内容是数字时，则比较数字的大小是否相等;
        当==两边的内容是对象或者对象的函数属性时，则比较内存地址是否相等;
        ==用于一般比较，===用于严格比较，==在比较的时候可以转换数据类型，===严格比较，只要类型不匹配就返回false;
        ==只要求值相等，===要求值和类型都相等;
    (2)NaN：非数值（是一个特殊的值），这个数值表示本来要返回数值的操作数未返回数值的情况;
        任何与NaN进行运算的结果均为NaN，NaN与自身不相等(NaN不予任何值相等);
        alert(NaN==NaN);弹出警告框并显示false
    (3)在浏览器的状态栏放入一条消息：window.status = "put your message here"
    (4)在HTML中，点击图片链接后页面转到历史列表中的上一个URL页面的代码如下：
        
    (5)null==undefined---结果为真 null===defined(结果为假false)（true）,NaN==NaN--结果为假（false）
    (6)如声明而未对变量赋值，该变量的值为undefined
    (7)有关html的描述：在页面顶部添加doctype声明，避免使用标签
    (8)块级元素实际占用的宽度与它的width、border和padding属性有关
    (9)匿名自执行函数(function(){});调用该类函数的对象是window
    (10)typeof是一个一元运算符，放在一个运算数之前，运算数可以是任意类型，返回值是一个字符串，该字符串说明运算数的类型
            1.以下操作数的返回结果为字符串（number），表示该操作数是number类型:
                数字类型的操作数typeof返回的值是number
                Infinity:无穷大特殊值;
                NaN:特殊的非数字值;
                Number.MAX_VALUE:最大数字;
                Number.MIN_VALUE:最小数字(与零接近);
                Number.NaN:特殊的非数字值;
                Number.POSITIOVE_INFINITY:无穷大的特殊值;
                Number.NEGATIVE_INFINITY:负无穷大的特殊值;
            2.字符串类型：返回值是表示类型的字符串（string）-该字符串表示该操作数位字符串类型;
            3.布尔类型:返回值是表示布尔类型的字符串（boolean）,该字符串表示该操作数为boolean类型;
            4.对于对象、数组、null返回的值是object
            5.对于函数类型，返回值是function,比如typeof(Date)返回值是function
            6.如果运算数是没有定义的（比如说不存在的变量、函数或者undefined），将返回undefined，typeof(undefined)返回值为undefined
    (11)1+ +"2":第一个+"2"的加号是一元操作符,空格+"2"会变成数值2，因此1+ +"2"相当于1+2等于3
    (12)javascript内置对象：
            Arguments函数参数集合;
            Array数组;
            Boolean布尔对象;
            Date日期时间;
            Error异常对象;
            Function函数构造器;
            Math数学对象;
            Number数值对象;
            Object基础对象;
            RegExp正则表达式对象;
            String字符串对象;
    (13)JavaScript内部所有数字都是以64位浮点数形式存储，即整数也是如此
    (14)在javascript中，直接通过function申明的函数，后面再次定义的，会影响到之前的引用(加入函数中有定义重复的内容，最终结果相当于调用后面的函数)
    (15)函数的调用方式有：
            直接调用;
            作为对象方法调用;
            作为构造函数调用;
            通过call和apply方法调用;
    (16)模块化有利于管理模块间的依赖，更依赖模块的维护;
            主流的模块化包括Common.JS,AMD,CMD等;
            AMD推崇依赖前置，CMD推崇依赖就近;
    (17)void()----该表达式的结果是undefined
            javascript:void(0)中最关键的是void关键字，
                void是javascript是JavaScript中非常重要的关键字，
                该操作符指定要计算一个表达式但是不返回值。
    (18)for-in语句:for(属性X in 对象){}
            用来枚举对象的属性
    (19)通过XMLHttpRequest更新一下元素，即通过div显示状态，哪个是正确的做法：

            var myDiv = document.getElementById("statusCode");
            myDiv.innerHTML = req.status;
    (20)全局函数不属于任何一个内置对象
    (21)下面的你方法可以用作javascript异步模式的编程：
            回调函数;
            事件监听;
            发布/订阅;
            Promises对象;
    (22)History对象的属性或方法的描述：
            back回到浏览器载入历史URL地址列表的当前URL的前一个URL;
            forword转到浏览器载入历史URL地址利比列表的当前URL的下一个URL;
            length保存历史URL地址列表的长度信息;
    (23)给网页添加javascript的方式：
            *使用script标签，将javascript代码写到之间;
            *添加外部javascript文件;
            *使用行内javascript;
            *使用@import引入javascript文件;
    (24)创建函数：
            function myFunction(){......}
            myFunction = function(){......}
    (25)JavaScript和jQuery的描述：
            *jQuery是一个JavaScript函数库，它极大地简化了JavaScript编程;
            *javascript是轻量级脚本语言，边解释边执行;
            *javascript可以解决的问题，使用jQuery也可以解决;
            *jQuery可以解决的问题，使用javascript也可以解决;
            *jQuery等价于$;
            *$()参数，可以是选择器，DOM对象，html字符串
                    -它相当于jQueyr中的jQuery();
                    -当DOM对象转化为jQuery对象后，就可以调用jQuery的方法;
                    -当$()的参数为DOM对象时，则该对象不需使用双引号包裹;
            *$(document).ready(fn)可以编写多个,它的简写形式是$(fn),网页中所有DOM文档结构绘制完毕后即刻执行（不需要所有的内容加载完毕）;
            *toggle():既可以模拟鼠标连续单击事件，又可以切换元素可见状态的;
            *正确控制元素(该元素的id="cart")的隐藏的语法：
                    $("#cart").css("display","none");
                    $("#cart").hide();
                    $("#cart").fadeOut(1000);
            *fadeOut()方法通过不透明度的变化来实现所有匹配元素的淡出效果，并再动画完成那个后可选地触发一个回调函数;
            *fadeIn()方法通过不透明度的变化来实现所有匹配元素的淡入效果，并在动画完成后可选地触发一个回调函数;
            *fadeToggle()方法通过不透明度的变化来开关所有匹配元素的淡入和淡出效果，并在动画完成后可选地触发一个回调函数;
            *
    (26)从一下标签中获取文本框里面的值的正确方法有：
            
            $(".txt").val();
            $(".txt").attr("value");
            $("#txtContent").attr("value");
    (27)解释如下代码：
            $("div").animate({
                width:"100px",
                borderWidth:10
            },1000,function(){
                alert(1);
            });
            解释：div元素会在1秒内宽度改为100像素，边框大小为10像素，然后弹出对话框;
    (28)HTML DOM window对象 alert()方法：
            alert()方法用于显示带有一条指定消息和一个KO按钮的警告框;
            alert(message);---message是要在window上弹出的对话框中显示的纯文本（而非HTML文本）;
            alert($):返回的是jQuery的内部;
            alert($()):返回的是jQuery对象;
            alert($("#box")):返回的是jQuery对象;
            注意：返回值都为[object Object]
    (29)load和ready的区别：
            window.onload:
                    执行时机：必须等待网页全部加载完毕（包括图片等）然后再执行包裹的代码;
                    执行次数：只能执行一次，如果第二次，那么第一次的执行结果会被覆盖;
                    简写方案：无;
            $(document).ready():
                    执行时机：只需要等待网页中的DOM结构加载完毕，就能执行包括的代码;
                    执行次数：可以执行多次，第N次都不会被上一次覆盖;
                    简写方案：$(function(){});
    (30)下面这两种实现的效果的是相同的:
            window.setTimeOut(方法名,时间值);---只写方法名，不带括号
            window.settIimeOut("方法名()",时间值);---带括号


------------》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》Web前端（对象+属性+事件）总结：

------------HTML文档---------------------HTML文档---------------------HTML文档--------


    
        
        
        
        
        
        
        
    
    
    
        

            

                
                文本内容
                粗体 斜体    大号字体    小号字体    打印机字体(等宽)    强调内容    更强调的内容
                计算机代码文本    样本文本    定义变量    定义引用    删除线删除线    下划线
                ^上标        _下标        

地址

            

            
            

---

            
            标题文字

            

                
                

                    
1. 项目一

                    

                        
• 项目1

                        
• 项目2

                    

                    
2. 项目三

                

                
                
                
                
                链接文本或图像
                
                文字
                链接点
                
                链接点
            

            
            
                
                
                
                
                    
                
                
                    
                    
                
                
                    
                    
                
            

表格标题

            
            
            

                
                
                
                
                

                
                
                    选项1
                    选项2
                    ......
                    选项N
                
                 <br>                    内容 <br>                
            

            
            

                

列表中的项目

                

对项目的描述

            

            

                

                

《书的名称》>

            

        

    


-------------框架文件--------------------框架文件--------------------框架文件---------


    
        
        
        
            
            ...
            
        
        
        ...
        
    

》》》》》》》内嵌框架：