澳门新萄京官方网站-www.8455.com-澳门新萄京赌场网址

澳门新萄京官方网站:前生现代,浓密探求HTML

2019-06-22 作者:澳门新萄京赌场网址   |   浏览(120)

HTML 5 History API的”前生今世”

2014/10/23 · HTML5 · HTML5

最初的作品出处: tuts    译文出处:记不清浅思的博客(@dwido)   

History是风趣的,不是吧?在头里的HTML版本中,我们对浏览历史记录的操作特别有限。大家能够来回使用能够选取的办法,但那便是整套大家能做的了。

唯独,利用HTML 5的History API,大家得以越来越好的主宰浏览器的历史记录了。举个例子:大家能够增多一条记下到历史记录的列表中,也许在一直不刷新时,能够创新鸿基土地资金财产址栏的USportageL。

深刻查究HTML5的History API,html5history

那篇小说首要介绍了入木七分探究HTML5的History API,重点讲述了HTML5中新的措施history.pushState()和history.replaceState(),要求的爱人能够参见下

History是好玩的,不是啊?在头里的HTML版本中,咱们对浏览历史记录的操作特别有限。大家得以来回使用能够选拔的诀窍,但这便是整个大家能做的了。

  不过,利用HTML 5的History API,大家得以越来越好的主宰浏览器的历史记录了。比方:大家能够增添一条记下到历史记录的列表中,大概在平昔不刷新时,能够立异鸿基土地资金财产址栏的U逍客L。
  为啥介绍History API ?

  在那篇小说中,我们将领会HTML 5中History API的起点。此前,大家常常应用散列值来更换页面内容,特别是那一个对页面特别首要的内容。因为未有刷新,所以对于单页面应用,改造其U帕杰罗L是相当的小概的。其余,当您转移U大切诺基L的散列值值,它对浏览器的历史记录未有其余影响。

  然后,未来对此HTML 5的History API来讲,这一个都以能够随便完结的,不过由于单页面应用没须求采纳散列值,它或者须要相当的开销脚本。它也允许大家用一种对SEO友好的诀要确立新利用。其余,它能收缩带宽,不过该怎么注明呢?

  在小说中,笔者将用History API开辟一个单页应用来申明上述的主题素材。

  那也意味自身必须先在首页加载须求的财富。现在开端,页面仅仅加载供给的内容。换句话说,应用并不是一开头就加载了全套的剧情,在呼吁第一个利用内容时,才会被加载。

  注意,您供给施行一些劳动器端编码只提供部分财富,而不是完全的页面内容。
  浏览器扶助

  在写那篇小说的时候,各主流浏览器对History API的扶助是老大不错的,能够点击这里查看其辅助景况,这些链接会告诉你帮助的浏览器,并利用以前,总有理想的实行来检查实验帮忙的特定作用。

  为了用产生格局分明浏览器是不是补助那个API,能够用上边包车型客车一条龙代码核查:  

XML/HTML Code复制内容到剪贴板

  1. return !!(window.history && history.pushState);  

  别的,作者提议参考一下这篇小说:Detect Support for Various HTML5 Features.(ps:后续会翻译)

  要是你是用的现世浏览器,能够用下边包车型大巴代码:  

XML/HTML Code复制内容到剪贴板

  1. if (Modernizr.history) {   
  2.     // History API Supported   
  3. }  

  假若您的浏览器不援助History API,能够使用history.js取代。
  使用History

  HTML 5提供了多个新措施:

  1、history.pushState();                2、history.replaceState();

  二种艺术都同意我们增添和换代历史记录,它们的劳作规律同样并且能够加上数量同样的参数。除了艺术之外,还会有popstate事件。在后文旅长介绍怎么使用和怎么着时候利用popstate事件。

  pushState()和replaceState()参数同样,参数表达如下:

  1、state:存储JSON字符串,能够用在popstate事件中。

  2、title:以往超过半数浏览器不援助照旧忽视那一个参数,最棒用null取代

  3、url:任性有效的U奥迪Q5L,用于更新浏览器的地址栏,并不在乎URL是不是早就存在地址列表中。更主要的是,它不会再次加载页面。

  五个方式的第一差别就是:pushState()是在history栈中增添多个新的条条框框,replaceState()是替换当前的记录值。假若您还对那些有吸引,就用一些示范来评释这么些分化。

  要是大家有三个栈块,贰个标识为1,另二个标记为2,你有第三个栈块,标记为3。当实施pushState()时,栈块3将被增多到已经存在的栈中,由此,栈就有3个块栈了。

  同样的比方情景下,当实践replaceState()时,就要块2的仓库和停放块3。所以history的记录条数不改变,也正是说,pushState()会让history的数目加1.

  比较结实如下图:
澳门新萄京官方网站 1

到此,为了调控浏览器的历史记录,大家忽略了pushState()和replaceState()的风浪。不过假使浏览器总计了非常的多的不行记录,用户大概会被重定向到那些页面,只怕也不会。在这种情况下,当用户选择浏览器的上进和落后导航开关时就能够发生意想不到的难题。

  尽管当大家利用pushState()和replaceState()实行管理时,期待popstate事件被触发。但实在,情状并不是如此。相反,当您浏览会话历史记录时,不管您是点击前进只怕后退按键,还是使用history.go和history.back方法,popstate都会被触发。

  In WebKit browsers, a popstate event would be triggered after document’s onload event, but Firefox and IE do not have this behavior.(在WebKit浏览器中,popstate事件在document的onload事件后触发,Firefox和IE未有这种作为)。
澳门新萄京官方网站:前生现代,浓密探求HTML5的History。  Demo示例

  HTML:  

XML/HTML Code复制内容到剪贴板

  1. <div class="container">  
  2.     <div class="row">  
  3.         <ul class="nav navbar-nav">  
  4.             <li><a href="home.html" class="historyAPI">Home</a></li>  
  5.             <li><a href="about.html" class="historyAPI">About</a></li>  
  6.             <li><a href="contact.html" class="historyAPI">Contact</a></li>  
  7.         </ul>  
  8.     </div>  
  9.     <div class="row">  
  10.         <div class="col-md-6">  
  11.             <div class="well">  
  12.                 Click on Links above to see history API usage using <code>pushState</code> method.   
  13.             </div>  
  14.         </div>  
  15.         <div class="row">      
  16.             <div class="jumbotron" id="contentHolder">  
  17.                 <h1>Home!</h1>  
  18.                 <p>Lorem Ipsum is simply dummy text of the <span style="width: auto; height: auto; float: none;" id="5_nwp"><a style="text-decoration: none;" mpid="5" target="_blank" href="" id="5_nwl"><span style="color:#0000ff;font-size:14px;width:auto;height:auto;float:none;">printing</span></a></span> and typesetting industry.</p>  
  19.             </div>  
  20.         </div>  
  21.     </div>  
  22. </div>  

  JavaScript:

XML/HTML Code复制内容到剪贴板

  1. <script type="text/<span style="width: auto; height: auto; float: none;" id="1_nwp"><a style="text-decoration: none;" mpid="1" target="_blank" href="" id="1_nwl"><span style="color:#0000ff;font-size:14px;width:auto;height:auto;float:none;">javascript</span></a></span>">  
  2.     jQuery('document').ready(function(){   
  3.              
  4.         jQuery('.historyAPI').on('click', function(e){   
  5.             e.preventDefault();   
  6.             var href = $(this).attr('href');   
  7.                  
  8.             // Getting Content   
  9.             getContent(href, true);   
  10.                  
  11.             jQuery('.historyAPI').removeClass('active');   
  12.             $(this).<span style="width: auto; height: auto; float: none;" id="2_nwp"><a style="text-decoration: none;" mpid="2" target="_blank" href="" id="2_nwl"><span style="color:#0000ff;font-size:14px;width:auto;height:auto;float:none;">add</span></a></span>Class('active');   
  13.         });   
  14.              
  15.     });   
  16.          
  17.     // Adding popstate event listener to handle browser back button    
  18.     window.addEventListener("popstate", function(e) {   
  19.              
  20.         // Get State value using e.state   
  21.         getContent(location.pathname, false);   
  22.     });   
  23.          
  24.     function getContent(url, addEntry) {   
  25.         $.get(url)   
  26.         .done(function( <span style="width: auto; height: auto; float: none;" id="3_nwp"><a style="text-decoration: none;" mpid="3" target="_blank" href="" id="3_nwl"><span style="color:#0000ff;font-size:14px;width:auto;height:auto;float:none;">data</span></a></span> ) {   
  27.                  
  28.             // Updating Content on Page   
  29.             $('#contentHolder').html(data);   
  30.                  
  31.             if(<span style="width: auto; height: auto; float: none;" id="4_nwp"><a style="text-decoration: none;" mpid="4" target="_blank" href="" id="4_nwl"><span style="color:#0000ff;font-size:14px;width:auto;height:auto;float:none;">add</span></a></span>Entry == true) {   
  32.                 // Add History Entry using pushState   
  33.                 history.pushState(null, null, url);   
  34.             }   
  35.                  
  36.         });   
  37.     }   
  38. </script>  

  总括(ps:喜欢那八个字~^_^~)

  HTML 第55中学的History API 对Web应用具备十分大的影响。为了更易于的创设有功效的、对SEO友好的单页面应用,它移除了对散列值的信赖。

API,html5history 那篇小说主要介绍了深远研究HTML5的History API,着重讲述了HTML5中新的点子history.pushState()和history.replaceSt...

HTML 5 History API的”前生今世”,api前生今世

原文:An Introduction To The HTML5 History API

译文:关于HTML 5 History API 的介绍

译者:dwqs

History是有趣的,不是啊?在事先的HTML版本中,大家对浏览历史记录的操作极其有限。我们能够来回使用能够选取的办法,但那便是全数我们能做的了。

只是,利用HTML 5的History API,大家能够更加好的主宰浏览器的历史记录了。比如:我们能够加多一条记下到历史记录的列表中,或然在平素不刷新时,能够创新鸿基土地资金财产址栏的UWranglerL。

 

怎么介绍History API ?

        在 那篇小说中,大家将驾驭HTML 5中History API的源于。从前,大家通常应用散列值来改变页面内容,非常是这些对页面特别首要的内容。因为尚未刷新,所以对于单页面应用,改造其ULacrosseL是不容许 的。其余,当你转移U奇骏L的散列值值,它对浏览器的历史记录未有其余影响。

        然后,以后对于HTML 5的History API来说,那么些都是足以Infiniti制完结的,不过出于单页面应用没须求运用散列值,它或者要求十分的支出脚本。它也同意大家用一种对SEO友好的办法创建新利用。其它,它能收缩带宽,不过该怎么注解呢?

        在作品中,小编将用History API开拓一个单页应用来表明上述的主题素材。

        那也意味自个儿必须先在首页加载要求的资源。将来初步,页面仅仅加载须求的内容。换句话说,应用并不是一齐先就加载了全套的原委,在伸手第贰个利用内容时,才会被加载。

注意,您须要实施一些服务器端编码只提供一些财富,而不是完全的页面内容。

 

浏览器扶助

         在写那篇小说的时候,各主流浏览器对History API的补助是非常科学的,能够点击这里查看其援救处境,这几个链接会告诉你帮衬的浏览器,并动用以前,总有巧妙的进行来检测帮忙的特定作用。

         为了用产生情势分明浏览器是或不是协助这一个API,可以用上面包车型客车一条龙代码核准:

return !!(window.history && history.pushState);

 

         别的,笔者建议参谋一下那篇小说:Detect Support for Various HTML5 Features.(ps:后续会翻译)

         假设您是用的现世浏览器,能够用上面包车型地铁代码:

if (Modernizr.history) {
    // History API Supported
}

 

         如果您的浏览器不援救History API,能够应用history.js取代。

 

使用History

        HTML 5提供了多少个新点子:

              1、history.pushState();                2、history.replaceState();

        二种方法都允许大家加多和翻新历史记录,它们的干活原理一样并且能够拉长数量一样的参数。除了艺术之外,还应该有popstate事件。在后文准将介绍怎么采用和哪些时候使用popstate事件。

        pushState()和replaceState()参数同样,参数表达如下:

              1、state:存款和储蓄JSON字符串,能够用在popstate事件中。

              2、title:以后多数浏览器不帮助依旧忽视那些参数,最棒用null替代

              3、url:狂妄有效的U福特ExplorerL,用于更新浏览器的地址栏,并不在乎U奥迪Q7L是还是不是业已存在地址列表中。更关键的是,它不会再也加载页面。

        多少个措施的严重性差别正是:pushState()是在history栈中增添二个新的条目款项,replaceState()是替换当前的记录值。假诺您还对那些有吸引,就用部分示范来证实这么些不相同。

        假使我们有八个栈块,二个符号为1,另三个标志为2,你有第四个栈块,标志为3。当奉行pushState()时,栈块3将被增多到已经存在的栈中,因而,栈就有3个块栈了。

        同样的举个例子情景下,当实行replaceState()时,将在块2的库房和停放块3。所以history的记录条数不改变,也便是说,pushState()会让history的数目加1.

比较结实如下图:

        到此,为了垄断(monopoly)浏览器的历史记录,大家忽视了pushState()和replaceState()的轩然大波。可是只要浏览器总括了大多的糟糕记录,用户可能会被重定向到那几个页面,可能也不会。在这种场地下,当用户使用浏览器的提升和倒退导航按键时就能够生出意料之外的标题。

        就算当大家应用pushState()和replaceState()举行拍卖时,期待popstate事件被触发。但事实上,情况并不是那般。相反,当你浏览会话历史记录时,不管你是点击前进可能后退按键,还是利用history.go和history.back方法,popstate都会被触发。

In WebKit browsers, a popstate event would be triggered after document’s onload event, but Firefox and IE do not have this behavior.(在WebKit浏览器中,popstate事件在document的onload事件后触发,Firefox和IE没有这种行为)。

      

Demo示例

       HTML:

<div class="container">
    <div class="row">
        <ul class="nav navbar-nav">
            <li><a href="home.html" class="historyAPI">Home</a></li>
            <li><a href="about.html" class="historyAPI">About</a></li>
            <li><a href="contact.html" class="historyAPI">Contact</a></li>
        </ul>
    </div>
    <div class="row">
        <div class="col-md-6">
            <div class="well">
                Click on Links above to see history API usage using <code>pushState</code> method.
            </div>
        </div>
        <div class="row">   
            <div class="jumbotron" id="contentHolder">
                <h1>Home!</h1>
                <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry.</p>
            </div>
        </div>
    </div>
</div>

 

       JavaScript:

<script type="text/javascript">
    jQuery('document').ready(function(){

        jQuery('.historyAPI').on('click', function(e){
            e.preventDefault();
            var href = $(this).attr('href');

            // Getting Content
            getContent(href, true);

            jQuery('.historyAPI').removeClass('active');
            $(this).addClass('active');
        });

    });

    // Adding popstate event listener to handle browser back button 
    window.addEventListener("popstate", function(e) {

        // Get State value using e.state
        getContent(location.pathname, false);
    });

    function getContent(url, addEntry) {
        $.get(url)
        .done(function( data ) {

            // Updating Content on Page
            $('#contentHolder').html(data);

            if(addEntry == true) {
                // Add History Entry using pushState
                history.pushState(null, null, url);
            }

        });
    }
</script>

 

          Demo 1:HTML 5 History API – pushState

野史条款在浏览器中被计算,并且能够很轻巧的行使浏览器的向上和倒退按键。View 德姆o  (ps:你在点击demo1的选项卡时,其记录会被增添到浏览器的历史记录,当点击后退/前进开关时,能够回来/跳到你此前点击的选项卡对应的页面)

          Demo 2:HTML 5 History API – replaceState

正史条款在浏览器中被更新,并且不可能使用浏览器的开辟进取和倒退按键实行浏览。View 德姆o  (ps:你在点击demo1的选项卡时,其记录会被替换当前浏览器的历史记录,当点击后退/前进按键时,不可以重临/跳到您前边点击的选项卡对应的页面,而是再次回到/跳到你进来demo2的上三个页面)

小结(ps:喜欢那多个字~^_^~)

       HTML 5中的History API 对Web应用具备相当大的影响。为了更易于的始建有功用的、对SEO友好的单页面应用,它移除了对散列值的重视。

下一篇:你在博客收音和录音集吗?

干什么介绍History API ?

在这篇小说中,大家将了然HTML 5中History API的来自。在此以前,我们平日使用散列值来改变页面内容,非常是那二个对页面非常紧要的内容。因为尚未刷新,所以对于单页面应用,改动其U卡宴L是不只怕的。别的,当您改换U昂CoraL的散列值值,它对浏览器的历史记录未有任何影响。

接下来,以后对此HTML 5的History API来讲,这个都以能够轻便达成的,不过出于单页面应用没须求选拔散列值,它恐怕要求相当的费用脚本。它也同意大家用一种对SEO友好的方法创设新应用。其它,它能压缩带宽,不过该怎么证明呢?

在篇章中,作者将用History API开拓三个单页应用来验证上述的标题。

那也表示小编无法不先在首页加载须求的能源。现在起来,页面仅仅加载须求的剧情。换句话说,应用并不是一开端就加载了方方面面包车型大巴原委,在伸手第二个使用内容时,才会被加载。

专注,您需求施行一些服务器端编码只提供部分财富,而不是完整的页面内容。

javascript:historygo(-1) 网页已过期 怎化解

逾期了。。。消除什么啊。。HTML5有个history的api,你能够去探视  

浏览器辅助

在写那篇小说的时候,各主流浏览器对History API的帮忙是特别科学的,能够点击这里查看其扶助景况,这些链接会告诉你支持的浏览器,并利用从前,总有喜爱得舍不得放手的推行来检查实验帮助的特定成效。

为了用形成格局明确浏览器是还是不是帮忙这几个API,能够用下边包车型地铁一行代码核准:

XHTML

return !!(window.history && history.pushState);

1
return !!(window.history && history.pushState);

除此以外,小编提议参照他事他说加以考查一下那篇小说:Detect Support for Various HTML5 Features.(ps:后续会翻译)

假定你是用的现世浏览器,能够用下边包车型地铁代码:

XHTML

if (Modernizr.history) { // History API Supported }

1
2
3
if (Modernizr.history) {
    // History API Supported
}

假如您的浏览器不援救History API,能够运用history.js代替。

html5 file api 上传文件

你能够到PHP100下面去问话下 ~ 在html5汉语件上传的话是将一切文件调换到base64编码然后在将文件存款和储蓄的 而你的PHP程序大概不读base64把  

5 History API的”前生今世”,api前生今世原著:An Introduction To The HTML5 History API 译文:关于HTML 5 History API 的牵线 译者:dwqs History是有趣...

使用History

HTML 5提供了多少个新格局:

1、history.pushState();                2、history.replaceState();

二种艺术都允许大家增添和换代历史记录,它们的做事规律同样并且能够增多数量一样的参数。除了艺术之外,还大概有popstate事件。在后文准将介绍怎么利用和哪一天利用popstate事件。

pushState()和replaceState()参数一样,参数表明如下:

澳门新萄京官方网站,1、state:存款和储蓄JSON字符串,能够用在popstate事件中。

2、title:未来好些个浏览器不帮忙仍然忽视那些参数,最棒用null代替

3、url:放肆有效的U卡宴L,用于创新浏览器的地址栏,并不在乎U酷路泽L是还是不是业已存在地址列表中。更重视的是,它不会再也加载页面。

五个议程的重大不相同正是:pushState()是在history栈中增添多少个新的条目款项,replaceState()是替换当前的记录值。固然您还对那个有吸引,就用部分示范来申明那个区别。

假若大家有三个栈块,二个标记为1,另四个符号为2,你有第七个栈块,标识为3。当实施pushState()时,栈块3将被增加到已经存在的栈中,因而,栈就有3个块栈了。

一样的如若情景下,当推行replaceState()时,将在块2的旅舍和停放块3。所以history的笔录条数不改变,也正是说,pushState()会让history的数据加1.

正如结实如下图:

澳门新萄京官方网站 2

 

到此,为了操纵浏览器的历史记录,大家忽视了pushState()和replaceState()的风浪。不过一旦浏览器总计了重重的二流记录,用户恐怕会被重定向到这么些页面,只怕也不会。在这种状态下,当用户使用浏览器的迈入和退化导航开关时就能发出意料之外的难点。

尽管当我们采纳pushState()和replaceState()实行拍卖时,期待popstate事件被触发。但实际上,情形并不是这么。相反,当您浏览会话历史记录时,不管你是点击前进可能后退按键,照旧采用history.go和history.back方法,popstate都会被触发。

In WebKit browsers, a popstate event would be triggered after document’s onload event, but Firefox and IE do not have this behavior.(在WebKit浏览器中,popstate事件在document的onload事件后触发,Firefox和IE未有这种作为)。

Demo示例

HTML:

XHTML

<div class="container"> <div class="row"> <ul class="nav navbar-nav"> <li><a href="home.html" class="historyAPI">Home</a></li> <li><a href="about.html" class="historyAPI">About</a></li> <li><a href="contact.html" class="historyAPI">Contact</a></li> </ul> </div> <div class="row"> <div class="col-md-6"> <div class="well"> Click on Links above to see history API usage using <code>pushState</code> method. </div> </div> <div class="row"> <div class="jumbotron" id="contentHolder"> <h1>Home!</h1> <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry.</p> </div> </div> </div> </div>

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
<div class="container">
    <div class="row">
        <ul class="nav navbar-nav">
            <li><a href="home.html" class="historyAPI">Home</a></li>
            <li><a href="about.html" class="historyAPI">About</a></li>
            <li><a href="contact.html" class="historyAPI">Contact</a></li>
        </ul>
    </div>
    <div class="row">
        <div class="col-md-6">
            <div class="well">
                Click on Links above to see history API usage using <code>pushState</code> method.
            </div>
        </div>
        <div class="row">  
            <div class="jumbotron" id="contentHolder">
                <h1>Home!</h1>
                <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry.</p>
            </div>
        </div>
    </div>
</div>

JavaScript:

JavaScript

<script type="text/javascript"> jQuery('document').ready(function(){ jQuery('.historyAPI').on('click', function(e){ e.preventDefault(); var href = $(this).attr('href'); // Getting Content getContent(href, true); jQuery('.historyAPI').removeClass('active'); $(this).addClass('active'); }); }); // Adding popstate event listener to handle browser back button window.addEventListener("popstate", function(e) { // Get State value using e.state getContent(location.pathname, false); }); function getContent(url, addEntry) { $.get(url) .done(function( data ) { // Updating Content on Page $('#contentHolder').html(data); if(addEntry == true) { // Add History Entry using pushState history.pushState(null, null, url); } }); } </script>

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
<script type="text/javascript">
    jQuery('document').ready(function(){
 
        jQuery('.historyAPI').on('click', function(e){
            e.preventDefault();
            var href = $(this).attr('href');
 
            // Getting Content
            getContent(href, true);
 
            jQuery('.historyAPI').removeClass('active');
            $(this).addClass('active');
        });
 
    });
 
    // Adding popstate event listener to handle browser back button
    window.addEventListener("popstate", function(e) {
 
        // Get State value using e.state
        getContent(location.pathname, false);
    });
 
    function getContent(url, addEntry) {
        $.get(url)
        .done(function( data ) {
 
            // Updating Content on Page
            $('#contentHolder').html(data);
 
            if(addEntry == true) {
                // Add History Entry using pushState
                history.pushState(null, null, url);
            }
 
        });
    }
</script>

Demo 1:HTML 5 History API – pushState

正史条目款项在浏览器中被总计,并且能够很轻巧的接纳浏览器的进化和向下开关。View Demo  (ps:你在点击demo1的选项卡时,其记录会被加多到浏览器的历史记录,当点击后退/前进按键时,可以回来/跳到您前边点击的选项卡对应的页面)

Demo 2:HTML 5 History API – replaceState

正史条目款项在浏览器中被更新,并且不可能选拔浏览器的发展和落后开关进行浏览。View Demo  (ps:你在点击demo1的选项卡时,其记录会被替换当前浏览器的历史记录,当点击后退/前进开关时,不得以回来/跳到您前面点击的选项卡对应的页面,而是再次来到/跳到你进去demo2的上二个页面)

小结(ps:喜欢这七个字~^_^~)

HTML 第55中学的History API 对Web应用具有十分大的影响。为了更易于的始建有效能的、对SEO友好的单页面应用,它移除了对散列值的借助。

赞 1 收藏 评论

澳门新萄京官方网站 3

本文由澳门新萄京官方网站发布于澳门新萄京赌场网址,转载请注明出处:澳门新萄京官方网站:前生现代,浓密探求HTML

关键词: