什么是JavaScript事件處理

這篇文章主要介紹“什么是JavaScript事件處理”,在日常操作中,相信很多人在什么是JavaScript事件處理問(wèn)題上存在疑惑,小編查閱了各式資料,整理出簡(jiǎn)單好用的操作方法,希望對(duì)大家解答”什么是JavaScript事件處理”的疑惑有所幫助!接下來(lái),請(qǐng)跟著小編一起來(lái)學(xué)習(xí)吧!

為順城等地區(qū)用戶提供了全套網(wǎng)頁(yè)設(shè)計(jì)制作服務(wù),及順城網(wǎng)站建設(shè)行業(yè)解決方案。主營(yíng)業(yè)務(wù)為網(wǎng)站建設(shè)、做網(wǎng)站、順城網(wǎng)站設(shè)計(jì),以傳統(tǒng)方式定制建設(shè)網(wǎng)站,并提供域名空間備案等一條龍服務(wù),秉承以專業(yè)、用心的態(tài)度為用戶提供真誠(chéng)的服務(wù)。我們深信只要達(dá)到每一位用戶的要求,就會(huì)得到認(rèn)可,從而選擇與我們長(zhǎng)期合作。這樣,我們也可以走得更遠(yuǎn)!

一.事件傳播機(jī)制

客戶端 JavaScript程序(就是瀏覽器啦)采用了異步事件驅(qū)動(dòng)編程模型。當(dāng)文檔、瀏覽器、元素或與之相關(guān)的對(duì)象發(fā)生某些有趣的事情時(shí),Web瀏覽器就會(huì)產(chǎn) 生事件(event)。如果JavaScript應(yīng)用程序關(guān)注特定類(lèi)型的事件,那么它可以注冊(cè)當(dāng)這類(lèi)事件發(fā)生時(shí)要調(diào)用的一個(gè)或多個(gè)函數(shù)。當(dāng)然了,這種風(fēng)格 并非Web編程獨(dú)有,所有使用圖形用戶界面的應(yīng)用程序都采用了它。

既然要詳解事件處理,那我們先從幾個(gè)基礎(chǔ)概念說(shuō)起吧:

①事件類(lèi)型(event type):是一個(gè)用來(lái)說(shuō)明發(fā)生什么類(lèi)型事件的字符串。例如,“mousemove”表示用戶移動(dòng)鼠標(biāo),“keydown”表示鍵盤(pán)上某個(gè)鍵被按下。事件類(lèi)型只是一個(gè)字符串,有時(shí)候又稱之為事件名字(event name);

②事件目標(biāo)(event target):是發(fā)生事件或與之相關(guān)的對(duì)象。Window、Document和Element對(duì)象是最常見(jiàn)的事件目標(biāo)。當(dāng)然,AJAX中的XMLHttpRequest對(duì)象也是一個(gè)事件目標(biāo);

③事件處理程序(event handler):是處理或響應(yīng)事件的函數(shù),它也叫事件監(jiān)聽(tīng)程序(event listener)。應(yīng)用程序通過(guò)指明事件類(lèi)型和事件目標(biāo),在Web瀏覽器中注冊(cè)它們的事件處理函數(shù)。

④事 件對(duì)象(event  object):是與特定事件相關(guān)且包含有關(guān)該事件詳細(xì)信息的對(duì)象。事件對(duì)象作為參數(shù)傳遞給事件處理函數(shù)(但是在IE8以及其之前版本中,全局變量 event才是事件對(duì)象)。事件對(duì)象都有用來(lái)指定事件類(lèi)型(event type)的type屬性和指定事件目標(biāo)(event  target)的target屬性(但是在IE8以及其之前版本中,用的是srcElement而非target)。當(dāng)然,不同類(lèi)型的事件還會(huì)為其相關(guān)事 件對(duì)象定義一些其他的獨(dú)有屬性。例如,鼠標(biāo)事件的相關(guān)對(duì)象會(huì)包含鼠標(biāo)指針的坐標(biāo),而鍵盤(pán)事件的相關(guān)對(duì)象會(huì)包含按下的鍵和輔助鍵的詳細(xì)信息。

以上說(shuō)完 了四個(gè)基本概念。那么問(wèn)題來(lái)了——如果在一個(gè)web頁(yè)面上用鼠標(biāo)點(diǎn)擊一個(gè)元素a的某一子元素b時(shí),應(yīng)該先執(zhí)行子元素b注冊(cè)的事件處理程序還是先執(zhí)行元素a 注冊(cè)的事件處理程序呢(假設(shè)元素a和它的子元素b都有注冊(cè)事件處理程序)?身為讀者的你是否想過(guò)這個(gè)問(wèn)題呢?

這個(gè)問(wèn)題就涉及到瀏覽器中的事件傳播(event propagation)機(jī)制。相信大家都聽(tīng)說(shuō)過(guò)事件冒泡(event bubble)和事件捕獲(event capturing)吧!沒(méi)錯(cuò),它們就是瀏覽器中的事件傳播機(jī)制。無(wú)圖無(wú)真相,沒(méi)有配圖?那怎么闊以:

什么是JavaScript事件處理

看了圖之 后相信你已經(jīng)大概理解了瀏覽器中的事件傳播機(jī)制了:當(dāng)一個(gè)事件發(fā)生時(shí),它會(huì)先從瀏覽器***對(duì)象Window一路向下傳遞,一直傳遞到觸發(fā)這個(gè)事件的那個(gè)元 素,這也就是事件捕獲過(guò)程。然而,一切并沒(méi)有結(jié)束,事件又從這個(gè)元素一路向上傳遞到Window對(duì)象,這也就是事件冒泡過(guò)程(但是在IE8以及其之前版本 中,事件模型并未定義捕獲過(guò)程,只有冒泡過(guò)程)。

所以,關(guān)于上面的問(wèn)題,還得看元素a注冊(cè)的事件處理程序是在捕獲過(guò)程還是在冒泡過(guò)程了。那么到底什么是在捕獲過(guò)程注冊(cè)事件處理程序,在冒泡過(guò)程注冊(cè)事件處理程序又是怎么做的呢?這就得好好說(shuō)說(shuō)幾種注冊(cè)事件處理程序的方式了:

1. 設(shè)置HTML標(biāo)簽屬性為事件處理程序

文檔元素的事件處理程序?qū)傩裕涿钟伞皁n”后面跟著事件名組成,例如:onclick、onmouseover。當(dāng)然了,這種形式只能為DOM元素注冊(cè)事件處理程序。實(shí)例:

<!DOCTYPE HTML> <html> <head>     <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>     <title>test</title>     <style type="text/css">         #div1{width: 300px; height: 300px; background: red; overflow:hidden;}         #div2{margin:50px auto; width: 200px; height: 200px; background: green; overflow:hidden;}         #div3{margin:50px auto; width: 100px; height: 100px; background: blue;}     </style> </head> <body>     <div id="div1" onClick="console.log('div1');">div1         <div id="div2" oNClick="console.log('div2');">div2             <div id="div3" onclick="console.log('div3');" onclick="console.log('div3333');">div3             </div>         </div>      </div> <script type="text/javascript"> </script> </body> </html>

結(jié)果(鼠標(biāo)點(diǎn)擊div3區(qū)域后):

什么是JavaScript事件處理

從結(jié)果中可以看出:

①因?yàn)镠TML里面不區(qū)分大小寫(xiě),所以這里事件處理程序?qū)傩悦髮?xiě)、小寫(xiě)、大小混寫(xiě)均可,屬性值就是相應(yīng)事件處理程序的JavaScript代碼;

②若給同一元素寫(xiě)多個(gè)onclick事件處理屬性,瀏覽器只執(zhí)行***個(gè)onclick里面的代碼,后面的會(huì)被忽略;

③這種形式是在事件冒泡過(guò)程中注冊(cè)事件處理程序的;

2.設(shè)置JavaScript對(duì)象屬性為事件處理程序

可以通過(guò)設(shè)置某一事件目標(biāo)的事件處理程序?qū)傩詠?lái)為其注冊(cè)相應(yīng)的事件處理程序。事件處理程序?qū)傩悦钟伞皁n”后面跟著事件名組成,例如:onclick、onmouseover。實(shí)例:

<!DOCTYPE HTML> <html> <head>     <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>     <title>test</title>     <style type="text/css">         #div1{width: 300px; height: 300px; background: red; overflow:hidden;}         #div2{margin:50px auto; width: 200px; height: 200px; background: green; overflow:hidden;}         #div3{margin:50px auto; width: 100px; height: 100px; background: blue;}     </style> </head> <body>     <div id="div1">div1         <div id="div2">div2             <div id="div3">div3             </div>         </div>     </div> <script type="text/javascript">     var div1 = document.getElementById('div1');     var div2 = document.getElementById('div2');     var div3 = document.getElementById('div3'); div1.onclick = function(){ console.log('div1'); }; div2.onclick = function(){ console.log('div2'); }; div3.onclick = function(){ console.log('div3'); }; div1.onclick = function(){ console.log('div11111'); };  div1.onClick = function(){ console.log('DIV11111'); };  </script> </body> </html>

結(jié)果(鼠標(biāo)點(diǎn)擊div3區(qū)域后):

什么是JavaScript事件處理

 從結(jié)果中可以看出:

①因?yàn)镴avaScript是嚴(yán)格區(qū)分大小寫(xiě)的,所以,這種形式下屬性名只能按規(guī)定小寫(xiě);

②若給同一元素對(duì)象寫(xiě)多個(gè)onclick事件處理屬性,后面寫(xiě)的會(huì)覆蓋前面的(ps:這就是在修改一個(gè)對(duì)象屬性的值,屬性的值是***確定的);

③這種形式也是在事件冒泡過(guò)程中注冊(cè)事件處理程序的;

3.addEventListener()

前兩種方式出現(xiàn)在Web初期,眾多瀏覽器都有實(shí)現(xiàn)。而addEventListener()方法是標(biāo)準(zhǔn)事件模型中定義的。任何能成為事件目標(biāo)的對(duì)象&mdash;&mdash; 這些對(duì)象包括Window對(duì)象、Document對(duì)象和所有文檔元素等&mdash;&mdash;都定義了一個(gè)名叫addEventListener()的方法,使用這個(gè)方法可 以為事件目標(biāo)注冊(cè)事件處理程序。addEventListener()接受三個(gè)參數(shù):***個(gè)參數(shù)是要注冊(cè)處理程序的事件類(lèi)型,其值是字符串,但并不包括前 綴“on”;第二個(gè)參數(shù)是指當(dāng)指定類(lèi)型的事件發(fā)生時(shí)應(yīng)該調(diào)用的函數(shù);第三個(gè)參數(shù)是布爾值,其可以忽略(某些舊的瀏覽器上不能忽略這個(gè)參數(shù)),默認(rèn)值為 false。這種情況是在事件冒泡過(guò)程中注冊(cè)事件處理程序。當(dāng)其為true時(shí),就是在事件捕獲過(guò)程中注冊(cè)事件處理程序。實(shí)例:

  1. <!DOCTYPE HTML> 

  2. <html> 

  3. <head> 

  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> 

  5. <title>test</title> 

  6. <style type="text/css"> 

  7. #div1{width: 300px; height: 300px; background: red; overflow:hidden;} 

  8. #div2{margin:50px auto; width: 200px; height: 200px; background: green; overflow:hidden;} 

  9. #div3{margin:50px auto; width: 100px; height: 100px; background: blue;} 

  10. </style> 

  11. </head> 

  12. <body> 

  13. <div id="div1">div1 

  14. <div id="div2">div2 

  15. <div id="div3">div3 

  16. </div> 

  17. </div> 

  18. </div> 

  19. <script type="text/javascript"> 

  20. var div1 = document.getElementById('div1'); 

  21. var div2 = document.getElementById('div2'); 

  22. var div3 = document.getElementById('div3'); 

  23. div1.addEventListener('click', function(){ console.log('div1-bubble'); }, false); 

  24. div2.addEventListener('click', function(){ console.log('div2-bubble'); }, false); 

  25. div3.addEventListener('click', function(){ console.log('div3-bubble'); }, false); 

  26. div3.addEventListener('click', function(){ console.log('div3-bubble222'); }, false); 

  27. div1.addEventListener('click', function(){ console.log('div1-capturing'); }, true); 

  28. div2.addEventListener('click', function(){ console.log('div2-capturing'); }, true); 

  29. div3.addEventListener('click', function(){ console.log('div3-capturing'); }, true); 

  30. </script> 

  31. </body> 

  32. </html>

結(jié)果(鼠標(biāo)點(diǎn)擊div3區(qū)域后):

什么是JavaScript事件處理

從結(jié)果中可以看出:

①addEventListener()第三個(gè)參數(shù)的作用正如上面所說(shuō);

②通過(guò)addEventListener()方法給同一對(duì)象注冊(cè)多個(gè)同類(lèi)型的事件,并不會(huì)發(fā)生忽略或覆蓋,而是會(huì)按順序依次執(zhí)行;

相對(duì)addEventListener()的是removeEventListener()方法,它同樣有三個(gè)參數(shù),前兩個(gè)參數(shù)自然跟 addEventListener()的意義一樣,而第三個(gè)參數(shù)也只需跟相應(yīng)的addEventListener()的第三個(gè)參數(shù)保持一致即可,同樣可以 省略,默認(rèn)值為false。它表示從對(duì)象中刪除某個(gè)事件處理函數(shù)。實(shí)例:

div1.addEventListener('click', div1BubbleFun, false); div1.removeEventListener('click', div1BubbleFun, false); function div1BubbleFun(){     console.log('div1-bubble'); }

4.attachEvent()

 但是,IE8以及其之前版本的瀏覽器并不支持addEventListener()和removeEventListener()。相應(yīng)的,IE定義了 類(lèi)似的方法attachEvent()和detachEvent()。因?yàn)镮E8以及其之前版本瀏覽器也不支持事件捕獲,所以attachEvent() 并不能注冊(cè)捕獲過(guò)程中的事件處理函數(shù),因此attachEvent()和detachEvent()要求只有兩個(gè)參數(shù):事件類(lèi)型和事件處理函數(shù)。而且,它 們的***個(gè)參數(shù)使用了帶“on”前綴的事件處理程序?qū)傩悦?。?shí)例:

var div1 = document.getElementById('div1'); div1.attachEvent('onclick', div1BubbleFun); function div1BubbleFun(){ console.log('div1-bubble'); }

相應(yīng)的,從對(duì)象上刪除事件處理程序函數(shù)使用detachEvent()。例如:

div1.detachEvent('onclick', div1BubbleFun);

到此為止,我們已經(jīng)說(shuō)了瀏覽器中事件傳播機(jī)制以及各種注冊(cè)事件處理程序的方法。下面我們就再說(shuō)說(shuō)事件處理程序調(diào)用時(shí)的一些問(wèn)題吧!

二.事件處理程序的調(diào)用

1.事件處理程序的參數(shù):正 如前面所說(shuō),通常事件對(duì)象作為參數(shù)傳遞給事件處理函數(shù),但I(xiàn)E8以及其之前版本的瀏覽器中全局變量event才是事件對(duì)象。所以,我們?cè)趯?xiě)相關(guān)代碼時(shí)應(yīng)該 注意兼容性問(wèn)題。實(shí)例(給頁(yè)面上id為div1的元素添加點(diǎn)擊事件,當(dāng)點(diǎn)擊該元素時(shí)在控制臺(tái)輸出事件類(lèi)型和被點(diǎn)擊元素本身):

<!DOCTYPE HTML> <html> <head>     <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>     <title>test</title>     <style type="text/css">         #div1{width: 300px; height: 300px; background: red; overflow: hidden;}     </style> </head> <body> <div id="div1">div1</div> <script type="text/javascript"> var div1 = document.getElementById('div1'); if(div1.addEventListener){ div1.addEventListener('click', div1Fun, false); }else if(div1.attachEvent){ div1.attachEvent('onclick', div1Fun); } function div1Fun(event){ event = event || window.event; var target = event.target || event.srcElement;             console.log(event.type);             console.log(target);         }     </script> </body> </html>

2.事件處理程序的運(yùn)行環(huán)境:關(guān)于事件處理程序的運(yùn)行環(huán)境,也就是在事件處理程序中調(diào)用上下文(this值)的指向問(wèn)題,可以看下面四個(gè)實(shí)例。
實(shí)例一:

  1. <!DOCTYPE HTML> 

  2. <html> 

  3. <head> 

  4.     <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> 

  5.     <title>test</title> 

  6.     <style type="text/css"> 

  7.         #div1{width: 300px; height: 300px; background: red; overflow: hidden;} 

  8.     </style> 

  9. </head> 

  10. <body> 

  11.     <div id="div1" onclick="console.log('html:'); console.log(this);">div1</div> 

  12.     <script type="text/javascript"> 

  13.     </script> 

  14. </body> 

  15. </html>

結(jié)果一:

什么是JavaScript事件處理

從結(jié)果可以看出:

①***種方法事件處理程序中this指向這個(gè)元素本身;

實(shí)例二:

<!DOCTYPE HTML> <html> <head>     <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>     <title>test</title>     <style type="text/css">         #div1{width: 300px; height: 300px; background: red; overflow: hidden;}     </style> </head> <body> <div id="div1" onclick="console.log('html:'); console.log(this);">div1</div> <script type="text/javascript"> var div1 = document.getElementById('div1'); div1.onclick = function(){ console.log('div1.onclick:'); console.log(this);         };     </script> </body> </html>

結(jié)果二:

什么是JavaScript事件處理

從結(jié)果可以看出:

①第二種方法事件處理程序中this也指向這個(gè)元素本身;

②存在第二種方法時(shí),它會(huì)覆蓋***種方法注冊(cè)的事件處理程序;

實(shí)例三:

<!DOCTYPE HTML> <html> <head>     <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>     <title>test</title>     <style type="text/css">         #div1{width: 300px; height: 300px; background: red; overflow: hidden;}     </style> </head> <body> <div id="div1" onclick="console.log('html:'); console.log(this);">div1</div> <script type="text/javascript"> var div1 = document.getElementById('div1'); div1.onclick = function(){ console.log('div1.onclick:'); console.log(this); }; div1.addEventListener('click', function(){ console.log('div1.addEventListener:'); console.log(this); }, false);     </script> </body> </html>

結(jié)果三:

什么是JavaScript事件處理

從結(jié)果可以看出:

①第三種方法事件處理程序中this也指向這個(gè)元素本身;

②第三種方法并不會(huì)覆蓋***種或第二種方法注冊(cè)的事件處理程序;

實(shí)例四:

  1. <!DOCTYPE HTML> 

  2. <html> 

  3. <head> 

  4.     <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> 

  5.     <title>test</title> 

  6.     <style type="text/css"> 

  7.         #div1{width: 300px; height: 300px; background: red; overflow: hidden;} 

  8.     </style> </head> <body> <div id="div1" onclick="console.log('html:'); console.log(this);">div1</div> <script type="text/javascript"> var div1 = document.getElementById('div1'); div1.onclick = function(){ console.log('div1.onclick:'); console.log(this); }; div1.attachEvent('onclick', function(){ console.log('div1.attachEvent:'); console.log(this === window); 

  9.         }); 

  10.         

  11.     </script> 

  12. </body> 

  13. </html>

結(jié)果四:

什么是JavaScript事件處理

從結(jié)果可以看出:

①第四種方法事件處理程序中this指向全局對(duì)象Window;

②第四種方法也不會(huì)覆蓋***種或第二種方法注冊(cè)的事件處理程序;

3.事件處理程序的調(diào)用順序:多個(gè)事件處理程序調(diào)用規(guī)則如下:

①通過(guò)HTML屬性注冊(cè)的處理程序和通過(guò)設(shè)置對(duì)象屬性的處理程序一直優(yōu)先調(diào)用;

②使用addEventListener()注冊(cè)的處理程序按照它們的注冊(cè)順序依次調(diào)用;

③使用attachEvent()注冊(cè)的處理程序可能按照任何順序調(diào)用,所以代碼不應(yīng)該依賴于調(diào)用順序;

4.事件取消:

①取消事 件的瀏覽器默認(rèn)操作(比如點(diǎn)擊超鏈接元素會(huì)自動(dòng)發(fā)生頁(yè)面跳轉(zhuǎn)的默認(rèn)操作):如果使用前兩種方法注冊(cè)事件處理程序,可以在處理程序中添加返回值false來(lái) 取消事件的瀏覽器默認(rèn)操作。在支持addEventListener()的瀏覽器中,也可以通過(guò)調(diào)用事件對(duì)象的preventDefault()方法取消 事件的默認(rèn)操作。至于IE8及其之前的瀏覽器可以通過(guò)設(shè)置事件對(duì)象的returnValue屬性為false來(lái)取消事件的默認(rèn)操作。參考代碼:

function cancelHandler(event){     var event = event || window.event;     if(event.preventDefault){         event.preventDefault();     }     if(event.returnValue){         event.returnValue = false;     }     return false; }

②取消事 件傳播:在支持addEventListener()的瀏覽器中,可以調(diào)用事件對(duì)象的一個(gè)stopPropagation()方法阻止事件的繼續(xù)傳播,它 能工作在事件傳播期間的任何階段(捕獲期階段、事件目標(biāo)本身、冒泡階段);但是在IE8以及其之前版本的瀏覽器中并不支持 stopPropagation()方法,而且這些瀏覽器也不支持事件傳播的捕獲階段,相應(yīng)的,IE事件對(duì)象有一個(gè)cancelBubble屬性,設(shè)置這 個(gè)屬性為true能阻止事件進(jìn)一步傳播(即阻止其冒泡)。參考代碼(阻止發(fā)生在div3區(qū)域的點(diǎn)擊事件冒泡到div2和div1):

  1. <!DOCTYPE HTML> 

  2. <html> 

  3. <head> 

  4.     <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> 

  5.     <title>test</title> 

  6.     <style type="text/css"> 

  7.         #div1{width: 300px; height: 300px; background: red; overflow:hidden;} 

  8.         #div2{margin:50px auto; width: 200px; height: 200px; background: green; overflow:hidden;} 

  9.         #div3{margin:50px auto; width: 100px; height: 100px; background: blue;} 

  10.     </style> </head> <body> <div id="div1">div1 <div id="div2">div2 <div id="div3">div3 </div> </div> </div> <script type="text/javascript"> var div1 = document.getElementById('div1'); var div2 = document.getElementById('div2'); var div3 = document.getElementById('div3');  div1.onclick = function(){ console.log('div1');  };  div2.onclick = function(){ console.log('div2');  };    div3.onclick = function(event){ stopEventPropagation(event); console.log('div3');  }; function stopEventPropagation(event){ var event = event || window.event; if(event.stopPropagation){ event.stopPropagation(); }else{ event.cancelBubble = true; 

  11.             } 

  12.         } 

  13.     </script> 

  14. </body> 

  15. </html>

到此,關(guān)于“什么是JavaScript事件處理”的學(xué)習(xí)就結(jié)束了,希望能夠解決大家的疑惑。理論與實(shí)踐的搭配能更好的幫助大家學(xué)習(xí),快去試試吧!若想繼續(xù)學(xué)習(xí)更多相關(guān)知識(shí),請(qǐng)繼續(xù)關(guān)注創(chuàng)新互聯(lián)網(wǎng)站,小編會(huì)繼續(xù)努力為大家?guī)?lái)更多實(shí)用的文章!

分享名稱:什么是JavaScript事件處理
轉(zhuǎn)載來(lái)源:http://muchs.cn/article14/ipjide.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供商城網(wǎng)站、做網(wǎng)站、虛擬主機(jī)搜索引擎優(yōu)化、全網(wǎng)營(yíng)銷(xiāo)推廣網(wǎng)頁(yè)設(shè)計(jì)公司

廣告

聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請(qǐng)盡快告知,我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如需處理請(qǐng)聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來(lái)源: 創(chuàng)新互聯(lián)

商城網(wǎng)站建設(shè)