Tap栏切换、选项卡切换特效(js)

使用“排他思想”。。。。。。
代码:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
    <style>
        #main {
            width: 600px;
            margin: 0 auto;
        }
        #btn {
            height: 50px;
        }
        #btn button {
            float: left;
        }
        #divBox div {
            width: 500px;
            height: 500px;
            margin-top: 50px;
            display: none;
        }
        .boxBgc {
            background-color: purple;
        }
    </style>
</head>
<body>
<div id="main">
    <div id="btn">
     <button class="boxBgc">第一个盒子</button>
     <button>第二个盒子</button>
     <button>第三个盒子</button>
     <button>第四个盒子</button>
     <button>第五个盒子</button>
    </div>
    <div id="divBox">
        <div style="display: block">第一个盒子</div>
        <div>第二个盒子</div>
        <div>第三个盒子</div>
        <div>第四个盒子</div>
        <div>第五个盒子</div>
    </div>
</div>
<script>
    window.onload = function () {
        //获取所有的button
        var btnBox = document.getElementById("btn").getElementsByTagName("button");
        //获取所有div
        var divBox = document.getElementById("divBox").getElementsByTagName("div");
        var btnLength = btnBox.length;
        var divLength = divBox.length;
        for (var i = 0; i < btnLength; i++) {
            btnBox[i].index = i;
            btnBox[i].onmouseover = function () {
                //清除所有button上的背景颜色
                for (var j = 0; j < btnLength; j++) {
                    //btnBox[i].style.backgroundColor = "";
                    btnBox[j].className = "";
                    divBox[j].style.display = "none";
                }
                this.className = "boxBgc";
                //影藏所有的div
                //for(var i =0;i<divLength;i++){
                //}
                divBox[this.index].style.display = "block";
            }

        }

    }
</script>
</body>
</html>

js选项卡特效

(C#)WebApi,Get\Post\Put\Delete

webservice与webapi的区别:
webservice:用的soap协议;
webapi:用的http协议


webapi使用场景:
1、当你想创建一个基于HTTP的面向资源的服务并且可以使用HTTP的全部特征时(比如URIs、request/response头,缓存,版本控制,多种内容格式),你应该选择Web API
2、当你想让你的服务用于浏览器、手机、iPhone和平板电脑时,你应该选择Web API

- 阅读剩余部分 -

(存储层MySQL优化)存储引擎选择

MySQL优化大致可以从以下几个反面来优化:
存储层、设计层、架构层、sql语句
存储层:存储引擎选择、字段类型选择、范式设计
MySQL常用存储引擎:Innodb、Myisam;
Memory、Archive这两个存储引擎,很少见,至少我还没见过.....


mysql存储引擎
Innodb:支持事务、行锁(并发性非常好)、外键
数据插入顺序:按照主键的顺序排列


Myisam:表锁(并发性低)、
数据插入顺序:自然顺序排列
有压缩机制


Archive:归档型存储引擎,只能写入、查询,不能更改、删除操作


Memory:内存型存储引擎,操作速度很快,但由于是在内存中,所以只能存放临时性数据。
就跟MemCache没有自带持久化功能一样(可以自己写服务,让数据持久化,但是Redis本身就有了持久化的特点:快照、aof)


Mysql5.5默认存储引擎都是innodb的