mui 选项卡与header文字同步

前端之家收集整理的这篇文章主要介绍了mui 选项卡与header文字同步前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

<h3 id="mui底部tab固定-头部nav可变">mui底部tab固定 头部nav可变




    <Meta charset="utf-8">
    Hello MUI@H_<a href="https://www.jb51.cc/tag/403/" target="_blank" class="keywords">403</a>_11@
    <<a href="https://www.jb51.cc/tag/Meta/" target="_blank" class="keywords">Meta</a> name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no">
    <<a href="https://www.jb51.cc/tag/Meta/" target="_blank" class="keywords">Meta</a> name="apple-mobile-web-app-capable" content="yes">
    <<a href="https://www.jb51.cc/tag/Meta/" target="_blank" class="keywords">Meta</a> name="apple-mobile-web-app-status-bar-style" content="black">
<pre><code><link rel="stylesheet" href="../../css/mui.min.css"&gt;
<style>
    html,body {
        background-color: #efeff4;
    }
    /*<a href="https://www.jb51.cc/tag/jiejue/" target="_blank" class="keywords">解决</a>: Unable to preventDefault inside passive event listener due to target being treated as passive. */
    * { touch-action: none; } 
</style></code></pre>
</head>
<body>
    <header class="mui-bar mui-bar-nav">
        <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
        <h1 id="title" class="mui-title">首页</h1>
    </header>
    <nav class="mui-bar mui-bar-tab">
        <a id="defaultTab" class="mui-tab-item mui-active" href="tab-webview-subpage-about.html">
            <span class="mui-icon mui-icon-home"></span>
            <span class="mui-tab-label">首页</span>
        </a>
        <a class="mui-tab-item" href="tab-webview-subpage-chat.html">
            <span class="mui-icon mui-icon-email"><span class="mui-badge">9</span></span>
            <span class="mui-tab-label">消息</span>
        </a>
        <a class="mui-tab-item" href="tab-webview-subpage-contact.html">
            <span class="mui-icon mui-icon-contact"></span>
            <span class="mui-tab-label">通讯录</span>
        </a>
        <a class="mui-tab-item" href="tab-webview-subpage-setting.html">
            <span class="mui-icon mui-icon-gear"></span>
            <span class="mui-tab-label">设置</span>
        </a>
    </nav>
    <script src="../../js/mui.min.js"></script>
    <script type="text/javascript" charset="utf-8">
         //mui初始化
        mui.init();
        var subpages = ['tab-webview-subpage-about.html','tab-webview-subpage-chat.html','tab-webview-subpage-contact.html','tab-webview-subpage-setting.html'];
        var subpage_style = {
            top: '45px',bottom: '51px'
        };
<pre><code>    var aniShow = {};

     //创建子<a href="https://www.jb51.cc/tag/yemian/" target="_blank" class="keywords">页面</a>,首个选项卡<a href="https://www.jb51.cc/tag/yemian/" target="_blank" class="keywords">页面</a><a href="https://www.jb51.cc/tag/xianshi/" target="_blank" class="keywords">显示</a>,其它均隐藏;
    mui.plusReady(function() {
        var self = plus.webview.currentWebview();
        for (var i = 0; i < 4; i++) {
            var temp = {};
            var sub = plus.webview.create(subpages[i],subpages[i],subpage_style);
            if (i > 0) {
                sub.hide();
            }else{
                temp[subpages[i]] = "true";
                mui.extend(aniShow,temp);
            }
            self.append(sub);
        }
    });
     //当前激活选项
    var activeTab = subpages[0];
    var title = document.getElementById("title");
     //选项卡点击事件
    mui('.mui-bar-tab').on('tap','a',function(e) {
        var targetTab = this.getAttribute('href');
        if (targetTab == activeTab) {
            return;
        }
        //更换<a href="https://www.jb51.cc/tag/biaoti/" target="_blank" class="keywords">标题</a>
        title.innerHTML = this.querySelector('.mui-tab-label').innerHTML;
                try{
        //<a href="https://www.jb51.cc/tag/xianshi/" target="_blank" class="keywords">显示</a>目标选项卡
        //若为iOS平台或非首次<a href="https://www.jb51.cc/tag/xianshi/" target="_blank" class="keywords">显示</a>,则直接<a href="https://www.jb51.cc/tag/xianshi/" target="_blank" class="keywords">显示</a>
        if(mui.os.ios||aniShow[targetTab]){
            plus.webview.show(targetTab);
        }else{
            //否则,使用fade-in动画,且保存变量
            var temp = {};
            temp[targetTab] = "true";
            mui.extend(aniShow,temp);
            plus.webview.show(targetTab,"fade-in",300);
        }
        //隐藏当前;
        plus.webview.hide(activeTab);
               }catch(e){}
        //更改当前活跃的选项卡
        activeTab = targetTab;
    });
     //<a href="https://www.jb51.cc/tag/zidingyi/" target="_blank" class="keywords">自定义</a>事件,模拟点击“<a href="https://www.jb51.cc/tag/shouye/" target="_blank" class="keywords">首页</a>选项卡”
    document.addEventListener('gohome',function() {
        var defaultTab = document.getElementById("defaultTab");
        //模拟<a href="https://www.jb51.cc/tag/shouye/" target="_blank" class="keywords">首页</a>点击
        mui.trigger(defaultTab,'tap');
        //切换选项卡高亮
        var current = document.querySelector(".mui-bar-tab>.mui-tab-item.mui-active");
        if (defaultTab !== current) {
            current.classList.remove('mui-active');
            defaultTab.classList.add('mui-active');
        }
    });
</script></code></pre>
</body>
</html></code></pre>
<p>原文 <a href="https://github.com/dcloudio/mui/blob/master/examples/hello-mui/examples/tab-webview-main.html" class="uri">https://github.com/dcloudio/mui/blob/master/examples/hello-mui/examples/tab-webview-main.html</a></p>
<h3 id="mui中用vue实现webapp项目基于mui框架webapp之头部导航与底部导航制作">mui中用vue实现[webAPP项目]基于MUI框架webAPP之头部导航与底部导航制作</h3>
<p><p class="pic_center"><img src="https://www.jb51.cc/res/2019/02-10/09/02568f1a232caec48a51f38bc2f01b97.png"></p></p>
<pre><code><!doctype html>
<html>
<pre><code><head>
    <meta charset="UTF-8"&gt;
    <title></title>
    <meta name="viewport" content="width=device-width,minimum-scale=1,user-scalable=no" />
    <link href="../../css/mui.min.css" rel="stylesheet" />
    <link rel="stylesheet" type="text/css" href="../../fonts/iconfont.css"&gt;
    <style>
        [v-cloak] {
            display: none !important;
        }
        /*解决: Unable to preventDefault inside passive event listener due to target being treated as passive. */

        * {
            touch-action: none;
        }
    </style>
</head>

<body>
    <div id="index" v-cloak>
        <header class="mui-bar mui-bar-nav"&gt;
            <span class="mui-icon mui-pull-right iconfont icon-kefu"&gt;</span>
            <h1 class="mui-title" id="title"&gt;{{title}}</h1>
        </header>
        <nav class="mui-bar mui-bar-tab"&gt;
            <a id="defaultTab" class="mui-tab-item mui-active" href="home.html"&gt;
                <span class="mui-icon iconfont icon-shouye"&gt;</span>
                <span class="mui-tab-label"&gt;首页</span>
            </a>
            <a class="mui-tab-item" href="shop.html"&gt;
                <span class="mui-icon iconfont icon-shangcheng"&gt;</span>
                <span class="mui-tab-label"&gt;商城</span>
            </a>
            <a class="mui-tab-item" href="task.html"&gt;
                <span class="mui-icon iconfont icon-renwu"&gt;</span>
                <span class="mui-tab-label"&gt;任务</span>
            </a>
            <a class="mui-tab-item" href="message.html"&gt;
                <span class="mui-icon iconfont icon-xiaoxi"&gt;</span>
                <span class="mui-tab-label"&gt;消息</span>
            </a>
            <a class="mui-tab-item" href="mine.html"&gt;
                <span class="mui-icon iconfont icon-wo"&gt;</span>
                <span class="mui-tab-label"&gt;我</span>
            </a>
        </nav>
    </div>
    <script src="../../js/mui.js"&gt;</script>
    <script src="../../js/vue.js"&gt;</script>
    <script type="text/javascript"&gt;
        (function(mui,Vue) {
            var index = new Vue({
                el: '#index',data: {
                    title: '<a href="https://www.jb51.cc/tag/shouye/" target="_blank" class="keywords">首页</a>'
                },mounted: function() {
                    var _this = this;
                    var subpages = ['home.html','shop.html','task.html','message.html','mine.html'];
                    var subpage_style = {
                        top: '45px',bottom: '51px'
                    };
                    var aniShow = {};
                    //创建子<a href="https://www.jb51.cc/tag/yemian/" target="_blank" class="keywords">页面</a>,单个选项卡<a href="https://www.jb51.cc/tag/yemian/" target="_blank" class="keywords">页面</a><a href="https://www.jb51.cc/tag/xianshi/" target="_blank" class="keywords">显示</a>,其他均隐藏
                    mui.plusReady(function() {
                        //<a href="https://www.jb51.cc/tag/huoqu/" target="_blank" class="keywords">获取</a><a href="https://www.jb51.cc/tag/dangqianyemian/" target="_blank" class="keywords">当前页面</a>对象
                        var self = plus.webview.currentWebview();
                        for(var i = 0; i < subpages.length; i++) {
                            var temp = {};
                            //创建页面
                            var sub = plus.webview.create(subpages[i],subpage_style);
                            if(i > 0) {
                                sub.hide(); //隐藏<a href="https://www.jb51.cc/tag/yemian/" target="_blank" class="keywords">页面</a>
                            } else {
                                //加载完成后<a href="https://www.jb51.cc/tag/guanbi/" target="_blank" class="keywords">关闭</a><a href="https://www.jb51.cc/tag/shouye/" target="_blank" class="keywords">首页</a>加载动画
                                temp[subpages[i]] = 'true';
                                mui.extend(aniShow,temp);
                            }
                            self.append(sub); //将webview对象填充到窗口的<a href="https://www.jb51.cc/tag/fangfa/" target="_blank" class="keywords">方法</a>
                        }
                    })
                    //当前激活选项
                    var activeTab = subpages[0];
                    var title = document.getElementById('title');
                    mui(".mui-bar-tab").on('tap',function(e) {
                        var targetTab = this.getAttribute('href'); //<a href="https://www.jb51.cc/tag/huoqu/" target="_blank" class="keywords">获取</a><a href="https://www.jb51.cc/tag/yemian/" target="_blank" class="keywords">页面</a>href
                        //更换<a href="https://www.jb51.cc/tag/biaoti/" target="_blank" class="keywords">标题</a>
                        _this.title = this.querySelector('.mui-tab-label').innerHTML;
                        if(targetTab == activeTab) {
                            return;
                        }
                        try {
                            //<a href="https://www.jb51.cc/tag/xianshi/" target="_blank" class="keywords">显示</a>目标选项卡
                            //若为iOS平台或非首次<a href="https://www.jb51.cc/tag/xianshi/" target="_blank" class="keywords">显示</a>,则直接<a href="https://www.jb51.cc/tag/xianshi/" target="_blank" class="keywords">显示</a>
                            if(mui.os.ios || aniShow[targetTab]) {
                                plus.webview.show(targetTab);
                            } else {
                                //否则,使用fade-in动画,且保存变量
                                var temp = {};
                                temp[targetTab] = "true";
                                mui.extend(aniShow,temp);
                                plus.webview.show(targetTab,300);
                            }
                            //                      plus.webview.show(targetTab);//<a href="https://www.jb51.cc/tag/xianshi/" target="_blank" class="keywords">显示</a>点击webview
                            plus.webview.hide(activeTab); //隐藏当前webview;
                        } catch(e) {

                        }
                        //更改当前活跃的选项卡
                        activeTab = targetTab;
                    })

                    //<a href="https://www.jb51.cc/tag/zidingyi/" target="_blank" class="keywords">自定义</a>事件,模拟点击“<a href="https://www.jb51.cc/tag/shouye/" target="_blank" class="keywords">首页</a>选项卡”
                    document.addEventListener('gohome',function(e) {
                        console.log(e)
                        var defaultTab = document.getElementById("defaultTab");
                        //模拟<a href="https://www.jb51.cc/tag/shouye/" target="_blank" class="keywords">首页</a>点击
                        mui.trigger(defaultTab,'tap');
                        //切换选项卡高亮
                        var current = document.querySelector(".mui-bar-tab>.mui-tab-item.mui-active");
                        if(defaultTab !== current) {
                            current.classList.remove('mui-active');
                            defaultTab.classList.add('mui-active');
                        }
                    });

                }
            })
        })(mui,Vue)
    </script>
</body></code></pre>
</html></code></pre><i class="glyphicon glyphicon-link"></i> 原文链接:/hbuilder/71600.html</div>
      <div class="topcard-tags"></div>
      
                 <ul class="list-group">
        <li class="list-group-item"><a href="/hbuilder/71601.html" title="用vue实现登录页面">上一篇:用vue实现登录页面</a><a href="/hbuilder/71599.html" title="vue点击切换颜色限制个数(用了mui框架)" class="text-muted pull-right">下一篇:vue点击切换颜色限制个数(用了mui</a>
    
    </li>
    </ul>
              </div>
            </div>
          </div>
          <!-- row end -->
          
          <div class="row row-sm">
            <div class="col-sm-12 col-md-12 col-lg-12">
              <div class="card">
<ins class="adsbygoogle"
     style="display:block"
     data-ad-format="autorelaxed"
     data-ad-client="ca-pub-4605373693034661"
     data-ad-slot="9144498553"></ins>
<script>
     (adsbygoogle = window.adsbygoogle || []).push({});
</script></div>
            </div>
          </div>

          <div class="row row-sm">
            <div class="col-sm-12 col-md-12 col-lg-12">
              <div class="card">
                  
    <div class="title"><h1>猜你在找的HBuilder相关文章</h1></div>
<div class="list_con">
                                    <a href="/hbuilder/497950.html" title="HBuilder打包App方法(图文教程)"><img class="lazy" src="/images/np.jpg" data-original="/res/2019/04-18/22/d787702b3fcb81512630a36e5dbea13e.png" title="" width="160" height="90" style="float:right;margin-left:30px;display:none;" /><div class="title">HBuilder打包App方法(图文教程)</div>
                                <div class="summary">HBuilder是DCloud(数字天堂)推出的一款支持HTML5的Web开发IDE。该软件既可以支持web代码...</div>
                                <time class="summary">作者:前端之家 时间:2019-04-27</time>
                                </a>
                            </div>
<div class="list_con">
                                    <a href="/hbuilder/497650.html" title="Hbuilder配置Avalon和Vue指令提示的方法详解"><div class="title">Hbuilder配置Avalon和Vue指令提示的方法详解</div>
                                <div class="summary">前言
本人是一名JAVA后端开发,偶尔也会研究一下前端内容,因为Hbuilder是基于eclipse开发...</div>
                                <time class="summary">作者:前端之家 时间:2019-04-27</time>
                                </a>
                            </div>
<div class="list_con">
                                    <a href="/hbuilder/497404.html" title="Hbuilder连远程接服务器上传代码的图文教程"><img class="lazy" src="/images/np.jpg" data-original="/res/2019/04-18/20/210d635d7cdb1e5350d01c4f81121656.jpg" title="" width="160" height="90" style="float:right;margin-left:30px;display:none;" /><div class="title">Hbuilder连远程接服务器上传代码的图文教程</div>
                                <div class="summary">1、打开Hbuilder编辑器,菜单-工具-插件安装-选择FTP-安装

2、在自己项目右键-部署-运行w...</div>
                                <time class="summary">作者:前端之家 时间:2019-04-27</time>
                                </a>
                            </div>
<div class="list_con">
                                    <a href="/hbuilder/414514.html" title="hbuilder里的webapp返回键不退出"><div class="title">hbuilder里的webapp返回键不退出</div>
                                <div class="summary">链接</div>
                                <time class="summary">作者:前端之家 时间:2019-04-27</time>
                                </a>
                            </div>
<div class="list_con">
                                    <a href="/hbuilder/413773.html" title="dcloud,hbuilderX开发uni-app第一天踩坑记录"><div class="title">dcloud,hbuilderX开发uni-app第一天踩坑记录</div>
                                <div class="summary">其实大部分坑在 uni-app在官网都有介绍 具体位置在 [在 uni-app 中使用 Vue.js][1] 模块 官...</div>
                                <time class="summary">作者:前端之家 时间:2019-04-27</time>
                                </a>
                            </div>
<div style="border-bottom: 1px solid #f4f4f4;margin-top:20px;">
<ins class="adsbygoogle"
     style="display:block"
     data-ad-format="fluid"
     data-ad-layout-key="-fr-2o+fp-dx-wx"
     data-ad-client="ca-pub-4605373693034661"
     data-ad-slot="4561116489"></ins>
<script>
     (adsbygoogle = window.adsbygoogle || []).push({});
</script>
</div><div class="list_con">
                                    <a href="/hbuilder/412532.html" title="HBuilder 运行无法开启问题解决办法"><div class="title">HBuilder 运行无法开启问题解决办法</div>
                                <div class="summary">注册表:HKEY_CURRENT_USER\Software\HBuilder (删除)</div>
                                <time class="summary">作者:前端之家 时间:2019-04-27</time>
                                </a>
                            </div>
<div class="list_con">
                                    <a href="/hbuilder/74660.html" title="HBuilder 打包流程"><img class="lazy" src="/images/np.jpg" data-original="/res/2019/03-05/01/2f8f1192e00ca51d84e082cb55fba90f.jpg" title="" width="160" height="90" style="float:right;margin-left:30px;display:none;" /><div class="title">HBuilder 打包流程</div>
                                <div class="summary">1.运行HBuilder---百度搜索HBuilder,官网下载安装包,解压,运行HBuilder.exe。注册账号,...</div>
                                <time class="summary">作者:前端之家 时间:2019-03-05</time>
                                </a>
                            </div>
<div class="list_con">
                                    <a href="/hbuilder/74659.html" title="HBuilder 打包 vue-cli 构建的 APP"><img class="lazy" src="/images/np.jpg" data-original="/res/2019/03-05/01/655cf757939b59589a18c6e2a0b0ac04.png" title="" width="160" height="90" style="float:right;margin-left:30px;display:none;" /><div class="title">HBuilder 打包 vue-cli 构建的 APP</div>
                                <div class="summary">1.在打包之前需要修改一个地方,那就是config->index.js文件,修改assetsPublicPath: ...</div>
                                <time class="summary">作者:前端之家 时间:2019-03-05</time>
                                </a>
                            </div>
<div class="list_con">
                                    <a href="/hbuilder/74658.html" title="Hybrid App混合模式开发的了解"><img class="lazy" src="/images/np.jpg" data-original="/res/2019/03-05/01/b7d2365fb5effd987beadd891724e9b2.png" title="" width="160" height="90" style="float:right;margin-left:30px;display:none;" /><div class="title">Hybrid App混合模式开发的了解</div>
                                <div class="summary">Hybrid App(混合模式移动应用)是指介于web-app、native-app这两者之间的app,兼具“Nati...</div>
                                <time class="summary">作者:前端之家 时间:2019-03-05</time>
                                </a>
                            </div>
<div class="list_con">
                                    <a href="/hbuilder/74657.html" title="HBuilder打包App方法"><img class="lazy" src="/images/np.jpg" data-original="/res/2019/03-05/01/d787702b3fcb81512630a36e5dbea13e.png" title="" width="160" height="90" style="float:right;margin-left:30px;display:none;" /><div class="title">HBuilder打包App方法</div>
                                <div class="summary">HBuilder是DCloud(数字天堂)推出的一款支持HTML5的Web开发IDE。该软件既可以支持web代码...</div>
                                <time class="summary">作者:前端之家 时间:2019-03-05</time>
                                </a>
                            </div>
<div style="border-bottom: 1px solid #f4f4f4;margin-top:20px;">
<ins class="adsbygoogle"
     style="display:block"
     data-ad-format="fluid"
     data-ad-layout-key="-fr-2o+fp-dx-wx"
     data-ad-client="ca-pub-4605373693034661"
     data-ad-slot="4561116489"></ins>
<script>
     (adsbygoogle = window.adsbygoogle || []).push({});
</script>
</div></div>
            </div>
          </div>
        </div>
        <!-- left end-->
        
        <!-- right -->
        <div class="col-sm-12 col-md-12 col-lg-3">
          <!-- row -->
          <div class="row row-sm">
            <div class="col-sm-12 col-md-12 col-lg-12">
              <div class="card">
                <label class="main-content-label ">编程分类</label>
                <div class="cate mt-20"><a href="/git/" title="Git">Git</a><a href="/github/" title="GitHub">GitHub</a><a href="/svn/" title="SVN">SVN</a><a href="/jenkins/" title="Jenkins">Jenkins</a><a href="/ssh/" title="SSH">SSH</a><a href="/jmeter/" title="Jmeter">Jmeter</a><a href="/systemd/" title="sysTemd">sysTemd</a><a href="/maven/" title="Maven">Maven</a><a href="/webpack/" title="Webpack">Webpack</a><a href="/zookeeper/" title="Zookeeper">Zookeeper</a><a href="/kubernetes/" title="Kubernetes">Kubernetes</a><a href="/phpstorm/" title="Phpstorm">Phpstorm</a><a href="/jvm/" title="JVM">JVM</a><a href="/idea/" title="IDEA">IDEA</a><a href="/hbuilder/" title="HBuilder">HBuilder</a><a href="/install/" title="安装教程">安装教程</a><a href="/tools/" title="开发工具">开发工具</a><a href="/markdown/" title="Markdown">Markdown</a><a href="/mac/" title="Mac">Mac</a><a href="/pytest/" title="Pytest">Pytest</a><a href="/selenium/" title="Selenium">Selenium</a><a href="/istio/" title="istio">istio</a><a href="/gradle/" title="Gradle">Gradle</a><a href="/tensorflow/" title="Tensorflow">Tensorflow</a><div class="clearfix"></div>
                </div>
              </div>
            </div>
          </div>
          <!-- row end -->
         <!-- row -->
          <div class="row row-sm">
            <div class="col-sm-12 col-md-12 col-lg-12">
              <div class="card"> 
<!-- f2er-rightads -->
<ins class="adsbygoogle"
     style="display:block"
     data-ad-client="ca-pub-4605373693034661"
     data-ad-slot="7756441254"
     data-ad-format="auto"
     data-full-width-responsive="true"></ins>
<script>
     (adsbygoogle = window.adsbygoogle || []).push({});
</script>
              </div>
            </div>
          </div>
          <!-- row end -->
          
          <!-- row -->
          <div class="row row-sm">
            <div class="col-sm-12 col-md-12 col-lg-12">
              <div class="card">
                <label class="main-content-label ">最新文章</label>
                <ul class="n-list"><li><a href="/hbuilder/497950.html" title="HBuilder打包App方法(图文教程)" target="_blank">• HBuilder打包App方法(图文</a></li>
<li><a href="/hbuilder/497650.html" title="Hbuilder配置Avalon和Vue指令提示的方法详解" target="_blank">• Hbuilder配置Avalon和Vue指</a></li>
<li><a href="/hbuilder/497404.html" title="Hbuilder连远程接服务器上传代码的图文教程" target="_blank">• Hbuilder连远程接服务器上</a></li>
<li><a href="/hbuilder/414514.html" title="hbuilder里的webapp返回键不退出" target="_blank">• hbuilder里的webapp返回键</a></li>
<li><a href="/hbuilder/413773.html" title="dcloud,hbuilderX开发uni-app第一天踩坑记录" target="_blank">• dcloud,hbuilderX开发uni-</a></li>
<li><a href="/hbuilder/413676.html" title="hbuilder修改注释" target="_blank">• hbuilder修改注释</a></li>
<li><a href="/hbuilder/412532.html" title="HBuilder 运行无法开启问题解决办法" target="_blank">• HBuilder 运行无法开启问题</a></li>
<li><a href="/hbuilder/74660.html" title="HBuilder 打包流程" target="_blank">• HBuilder 打包流程</a></li>
<li><a href="/hbuilder/74659.html" title="HBuilder 打包 vue-cli 构建的 APP" target="_blank">• HBuilder 打包 vue-cli 构</a></li>
<li><a href="/hbuilder/74658.html" title="Hybrid App混合模式开发的了解" target="_blank">• Hybrid App混合模式开发的</a></li>
</ul>
              </div>
            </div>
          </div>
          <!-- row end -->


          <!-- row -->
          <div class="row row-sm">
            <div class="col-sm-12 col-md-12 col-lg-12">
              <div class="card">
                <label class="main-content-label ">热门标签
                  <span class="pull-right tx-12">
                    <a href="/all" target="_blank">更多 ►</a></span>
                </label>
                <div class="topcard-tags"><a href="/tag/Gitjiaocheng/" title="Git教程" target="_blank">Git教程</a><a href="/tag/minganwenti/" title="敏感问题" target="_blank">敏感问题</a><a href="/tag/MVPmoshi/" title="MVP模式" target="_blank">MVP模式</a><a href="/tag/Webstormshiyongjiaochengxiangjie/" title="Webstorm使用教程详解" target="_blank">Webstorm使用</a><a href="/tag/webstormwufaxianshizuobianwenjianjiamuludejiejuefangfa/" title="webstorm无法显示左边文件夹目录的解决方法" target="_blank">webstorm无法</a><a href="/tag/windowsxitonganzhuanggitdefangfa/" title="windows 系统安装git的方法" target="_blank">windows 系统</a><a href="/tag/WindowshanganzhuangNodejs/" title="Window 上安装Node.js" target="_blank">Window 上安装</a><a href="/tag/anzhuangSVNbingjinxingyihuadexiangxibuzou/" title="安装SVN并进行汉化的详细步骤" target="_blank">安装SVN并进行</a><a href="/tag/TortoiseSVNqiehuangenggaidengluzhanghaomima/" title="TortoiseSVN切换更改登录账号密码" target="_blank">TortoiseSVN切</a><a href="/tag/dabaoliucheng/" title="打包流程" target="_blank">打包流程</a><a href="/tag/HBuilder/" title="HBuilder" target="_blank">HBuilder</a><a href="/tag/docsify/" title="docsify" target="_blank">docsify</a><a href="/tag/svnjiaocheng/" title="svn教程" target="_blank">svn教程</a><a href="/tag/tortoisegit/" title="tortoisegit" target="_blank">tortoisegit</a><a href="/tag/EasyDigitalDownloads/" title="Easy Digital Downloads" target="_blank">Easy Digital</a><a href="/tag/tagit/" title="tagit" target="_blank">tagit</a><a href="/tag/gitanzhuang/" title="git安装" target="_blank">git安装</a><a href="/tag/Nodejsdajiangitfuwuqi/" title="Node.js搭建git服务器" target="_blank">Node.js搭建g</a><a href="/tag/github/" title="github" target="_blank">github</a><a href="/tag/githubyulanvuexiangmu/" title="github预览vue项目" target="_blank">github预览vu</a><a href="/tag/mpvuekaifagithub/" title="mpvue开发github" target="_blank">mpvue开发git</a><a href="/tag/mpvuekaifagithubxiaochengxu/" title="mpvue开发github小程序" target="_blank">mpvue开发git</a><a href="/tag/gitee/" title="gitee" target="_blank">gitee</a><a href="/tag/ctypedigit/" title="ctype_digit" target="_blank">ctype_digit</a><a href="/tag/SVN/" title="SVN" target="_blank">SVN</a><a href="/tag/diaoyongSVNmingling/" title="调用SVN命令" target="_blank">调用SVN命令</a><a href="/tag/gitzidongbushu/" title="git自动部署" target="_blank">git自动部署</a><a href="/tag/git/" title="git" target="_blank">git</a><a href="/tag/svnbanben/" title="svn版本" target="_blank">svn版本</a><a href="/tag/neizhisvnhanshu/" title="内置svn函数" target="_blank">内置svn函数</a></div>
              </div>
            </div>
          </div>
          <!-- row end -->
          
          
         <!-- row -->
          <div class="row row-sm">
            <div class="col-sm-12 col-md-12 col-lg-12">
              <div class="card"> 
<!-- f2er-rightads -->
<ins class="adsbygoogle"
     style="display:block"
     data-ad-client="ca-pub-4605373693034661"
     data-ad-slot="7756441254"
     data-ad-format="auto"
     data-full-width-responsive="true"></ins>
<script>
     (adsbygoogle = window.adsbygoogle || []).push({});
</script>
              </div>
            </div>
          </div>
          <!-- row end -->
          
          </div>
        <!-- right end -->
        </div>
    </div>

     <footer id="footer">
    <div class="container">
        <div class="row hidden-xs">
             <dl class="col-sm-6 site-link">
                <dt>最近更新</dt><dd><a href="/faq/884225.html" title="jQuery选择伪元素:after" target="_blank">· jQuery选择伪元素:after</a><span class="text-muted pull-right">10-20</span></dd>
<dd><a href="/faq/884224.html" title="JavaScript随机颜色生成器" target="_blank">· JavaScript随机颜色生成器</a><span class="text-muted pull-right">10-20</span></dd>
<dd><a href="/faq/884223.html" title="JavaScript指数" target="_blank">· JavaScript指数</a><span class="text-muted pull-right">10-20</span></dd>
<dd><a href="/faq/884222.html" title="addResourceHandlers无法解析静态资源" target="_blank">· addResourceHandlers无法解析静态资源</a><span class="text-muted pull-right">10-20</span></dd>
<dd><a href="/faq/884221.html" title="如何将字节数组转换为MultipartFile" target="_blank">· 如何将字节数组转换为MultipartFile</a><span class="text-muted pull-right">10-20</span></dd>
<dd><a href="/faq/884220.html" title="在java中如何创建一个文件并写入内容?" target="_blank">· 在java中如何创建一个文件并写入内容?</a><span class="text-muted pull-right">10-20</span></dd>
<dd><a href="/faq/884219.html" title="星号*在Python中是什么意思?" target="_blank">· 星号*在Python中是什么意思?</a><span class="text-muted pull-right">10-20</span></dd>
<dd><a href="/faq/884218.html" title="Flask框架:MVC模式" target="_blank">· Flask框架:MVC模式</a><span class="text-muted pull-right">10-20</span></dd>
<dd><a href="/faq/884217.html" title="在JavaScript对象数组中按ID查找对象" target="_blank">· 在JavaScript对象数组中按ID查找对象</a><span class="text-muted pull-right">10-20</span></dd>
<dd><a href="/faq/884216.html" title="使用Javascript / jQuery下载文件" target="_blank">· 使用Javascript / jQuery下载文件</a><span class="text-muted pull-right">10-20</span></dd>
</dl>
            
           <dl class="col-sm-4 site-link">
                <dt>好站推荐</dt><dd> <a href="https://www.runoob.com" title="菜鸟教程(www.runoob.com)提供了编程的基础技术教程, 介绍了HTML、CSS、Javascript、Python,Java,Ruby,C,PHP , MySQL等各种编程语言的基础知识。 同时本站中也提供了大量的在线实例,通过实例,您可以更好的学习编程。" target="_blank">菜鸟教程</a></dd><dd> <a href="https://www.jb51.cc" title="编程之家(www.jb51.cc)是成立于2017年面向全球中文开发者的技术内容分享平台。提供编程导航、编程问答、编程博文、编程百科、编程教程、编程工具、编程实例等开发者最需要的编程技术内容与开发工具支持,与你一起学习编程,相信编程改变未来!" target="_blank">编程之家</a></dd><dd> <a href="" title="前端之家 f2er.com 前端开发人员所需学习知识手册。" target="_blank">前端之家</a></dd></dl>

            <dl class="col-sm-2 site-link">
                <dt>商务合作</dt>
                <dd><a target="_blank" href="http://wpa.qq.com/msgrd?v=3&uin=76874919&site=qq&menu=yes">联系我们</a></dd>
            </dl>

        </div>
        <div class="copyright">
            Copyright © 2019 前端之家. 当前版本 V7.0.16<br>
            <span class="ml5">前端之家 版权所有 
            <a href="https://beian.miit.gov.cn/"  target="_blank"  rel="nofollow">闽ICP备13020303号-10</a></span>
        </div>
    </div>
</footer>
<script type="text/javascript" src="/js/base.js"></script>
</body>
</html>