show = function(){

    //loading dom元素

    var Div = document.createElement("div");

    Div.setAttribute("class","ui-loading");

    var chidDiv = document.createElement("div");

    chidDiv.setAttribute("class","ui-loading-mask")

    Div.appendChild(chidDiv)

    document.body.appendChild(Div)

}

hide= function(){

    var Div = document.getElementsByClassName("ui-loading");

     while(Div[0].hasChildNodes()) //当div下还存在子节点时 循环继续

    {

        Div[0].removeChild(Div[0].firstChild);

    }

    var par = Div[0].parentNode;

    par.removeChild(Div[0])

}

/*

 *    loading加载动画样式

 */

.ui-loading{

    position: fixed;

    top:;

    right:;

    bottom:;

    left:;

    z-index:;

    background-color: rgba(0,0,0,.4);

}

.ui-loading-mask{

    width: 6px;

    height: 6px;

    border-radius: 50%;

    -webkit-animation: typing 1s linear infinite alternate;

       -moz-animation: Typing 1s linear infinite alternate;

            animation: typing 1s linear infinite alternate;

    margin: 80% auto 0; /* Not necessary- its only for layouting*/

    position: relative;

    left: -12px;

}

@-webkit-keyframes typing{

    0%{

        background-color: rgba(255,255,255, 1);

        box-shadow: 12px 0px 0px 0px rgba(255,255,255,0.2),

                    24px 0px 0px 0px rgba(255,255,255,0.2);

      }

    25%{

        background-color: rgba(255,255,255, 0.4);

        box-shadow: 12px 0px 0px 0px rgba(255,255,255,2),

                    24px 0px 0px 0px rgba(255,255,255,0.2);

    }

    75%{ background-color: rgba(255,255,255, 0.4);

        box-shadow: 12px 0px 0px 0px rgba(255,255,255,0.2),

                    24px 0px 0px 0px rgba(255,255,255,1);

      }

}

@-moz-keyframes typing{

   0%{

        background-color: rgba(255,255,255, 1);

        box-shadow: 12px 0px 0px 0px rgba(255,255,255,0.2),

                    24px 0px 0px 0px rgba(255,255,255,0.2);

      }

    25%{

        background-color: rgba(255,255,255, 0.4);

        box-shadow: 12px 0px 0px 0px rgba(255,255,255,2),

                    24px 0px 0px 0px rgba(255,255,255,0.2);

    }

    75%{ background-color: rgba(255,255,255, 0.4);

        box-shadow: 12px 0px 0px 0px rgba(255,255,255,0.2),

                    24px 0px 0px 0px rgba(255,255,255,1);

      }

}

@keyframes typing{

   0%{

        background-color: rgba(255,255,255, 1);

        box-shadow: 12px 0px 0px 0px rgba(255,255,255,0.2),

                    24px 0px 0px 0px rgba(255,255,255,0.2);

      }

    25%{

        background-color: rgba(255,255,255, 0.6);

        box-shadow: 12px 0px 0px 0px rgba(255,255,255,2),

                    24px 0px 0px 0px rgba(255,255,255,0.2);

    }

    75%{ background-color: rgba(255,255,255, 0.4);

        box-shadow: 12px 0px 0px 0px rgba(255,255,255,0.2),

                    24px 0px 0px 0px rgba(255,255,255,1);

      }

      100%{ background-color: rgba(255,255,255, 0.1);

        box-shadow: 12px 0px 0px 0px rgba(255,255,255,0.2),

                    24px 0px 0px 0px rgba(255,255,255,1);

      }

}