jQuery详细教程,基础内容罗列
jQuery技術準備
一 . jquery 語法
jQuery 語法是通過選取 HTML 元素,并對選取的元素執行某些操作。
基礎語法: $(selector).action()
- 美元符號定義 jQuery
- 選擇符(selector)“查詢"和"查找” HTML 元素
- jQuery 的 action() 執行對元素的操作
實例:
-
$(this).hide() - 隱藏當前元素
-
$(“p”).hide() - 隱藏所有
元素
-
$(“p.test”).hide() - 隱藏所有 class=“test” 的
元素
-
$(“#test”).hide() - 隱藏 id=“test” 的元素
jQuery 入口函數:
$(document).ready(function(){// 執行代碼 }); //或者 $(function(){// 執行代碼 }); //以上兩種方式你可以選擇你喜歡的方式實現文檔就緒后執行 jQuery 方法。二 . jquery 選擇器
jQuery 選擇器允許您對 HTML 元素組或單個元素進行操作。
jQuery 選擇器基于元素的 id、類、類型、屬性、屬性值等"查找"(或選擇)HTML 元素。 它基于已經存在的 CSS 選擇器,除此之外,它還有一些自定義的選擇器。
jQuery 中所有選擇器都以美元符號開頭:$()。
tag元素選擇器
//jQuery 元素選擇器基于元素名選取元素。 $("p")#id 選擇器
jQuery #id 選擇器通過 HTML 元素的 id 屬性選取指定的元素。
頁面中元素的 id 應該是唯一的,所以您要在頁面中選取唯一的元素需要通過 #id 選擇器。
.class 選擇器
jQuery 類選擇器可以通過指定的 class 查找元素。
$(".test")更多
| $(“*”) | 選取所有元素 |
| $(this) | 選取當前HTML元素 |
| $(“p.intro”) | 選取class為intro的<p>元素 |
| $(“p:first”) | 選取第一個 <p> 元素 |
| $(“ul li:first”) | 選取第一個 <ul> 元素的第一個 <li> 元素 |
| $(“ul li:first-child”) | 選取每個 <ul> 元素的第一個 <li> 元素 |
| $(“[href]”) | 選取帶有 href 屬性的元素 |
| $(“a[target=‘_blank’]”) | 選取所有 target 屬性值等于 “_blank” 的 <a> 元素 |
| $(“a[target!=‘_blank’]”) | 選取所有 target 屬性值不等于 “_blank” 的 元素 |
| $(“:button”) | 選取所有 type=“button” 的 <input> 元素 和 <button> 元素 |
| $(“tr:even”) | 選取偶數位置的 <tr> 元素 |
| $(“tr:odd”) | 選取奇數位置的 <tr> 元素 |
三. jquery 事件
頁面對不同訪問者的響應叫做事件。
事件處理程序指的是當 HTML 中發生某些事件時所調用的方法。
jQuery 中,大多數 DOM 事件都有一個等效的 jQuery 方法。
鼠標事件
click() 元素點擊后觸發事件
$("p").click(function(){// 動作觸發后執行的代碼!! });dbclick() 元素雙擊后觸發事件
$("p").dbclick(function(){// 動作觸發后執行的代碼!! });mouseenter() 鼠標移入元素后觸發事件
$("p").mouseenter(function(){alert('您的鼠標移到了 id="p1" 的元素上!'); });mouseleave() 鼠標移出元素后觸發事件
$("p").mouseleave(function(){// 動作觸發后執行的代碼!! });mousedown() 鼠標在該元素上按下按鍵時觸發事件
$("#p1").mousedown(function(){alert("鼠標在該段落上按下!"); });mouseup() 鼠標在該元素上松開按鍵時觸發事件
$("#p1").mouseup(function(){alert("鼠標在該段落上松開!"); });hover()方法用于模擬光標懸停事件。
當鼠標移動到元素上時,會觸發指定的第一個函數(mouseenter);當鼠標移出這個元素時,會觸發指定的第二個函數(mouseleave)。
$("#p1").hover(function(){alert("你進入了 p1!");},function(){alert("拜拜! 現在你離開了 p1!");} );表單事件
focus() 表單元素獲取焦點觸發事件
/*當通過鼠標點擊選中元素或通過 tab 鍵定位到元素時,該元素就會獲得焦 點。focus() 方法觸發 focus 事件,或規定當發生 focus 事件時運行的函數:*/ $("input").focus(function(){$(this).css("background-color","#cccccc"); });blur() 表單元素失去焦點觸發事件
/*當元素失去焦點時,發生 blur 事件。 blur() 方法觸發 blur 事件,或規定當發生 blur 事件時運行的函數:*/ $("input").blur(function(){$(this).css("background-color","#ffffff"); });submit() 提交表單時觸發的事件
/*該事件只適用于 <form> 元素。 submit() 方法觸發 submit 事件,或規定當發生 submit 事件時運行的函數。*/ $("form").submit(function(){alert("提交"); });change() 當元素值改變時觸發的事件
change() 方法觸發 change 事件,或規定當發生 change 事件時運行的函數。
注意:當用于 select 元素時,change 事件會在選擇某個選項時發生。當用于 text field 或 text area 時,change 事件會在元素失去焦點時發生。
鍵盤事件
keydown() - 鍵按下的過程
$("input").keydown(function(){$("input").css("background-color","yellow"); });keypress() - 鍵被按下
$("input").keypress(function(){$("span").text(i+=1); });keyup() - 鍵被松開
$("input").keyup(function(){$("input").css("background-color","pink"); });文檔/窗口事件
loag() 元素加載時觸發的事件
//當圖像全部加載時警報文本: $("img").load(function(){alert("圖片已載入"); });load() 方法在 jQuery 版本 1.8 中已廢棄。
reaize() 調整瀏覽器窗口大小時觸發的事件
resize() 方法觸發 resize 事件,或規定當發生 resize 事件時運行的函數。
$(selector).resize(); //或 $(window).resize(function(){$('span').text(x+=1); });scroll() 當用戶滾動指定的元素時觸發的事件
當用戶滾動指定的元素時,會發生 scroll 事件。
scroll 事件適用于所有可滾動的元素和 window 對象(瀏覽器窗口)。
scroll() 方法觸發 scroll 事件,或規定當發生 scroll 事件時運行的函數。
unload() 當用戶離開當前頁面時觸發
/* 當發生以下情況下,會觸發 unload 事件: 點擊某個離開頁面的鏈接 在地址欄中鍵入了新的 URL 使用前進或后退按鈕 關閉瀏覽器窗口 重新加載頁面 */ $(window).unload(function(){alert("Goodbye!"); }); unload() 方法在 jQuery 版本 1.8 中被廢棄,在 3.0 版本被移除。 Firefox 與 Chrome 會阻止彈窗,所以沒辦法看到效果。四. jQuery效果(隱藏、顯示、切換、滑動、淡入淡出、動畫)
1. 顯示/隱藏
hide()和show()
通過hide()和show()方法來隱藏和顯示HTNL元素 $("#hide").click(function(){$("p").hide(); });$("#show").click(function(){$("p").show(); });語法:
$(selector).hide(speed,callback);
$(selector).show(speed,callback);
可選的 speed 參數規定隱藏/顯示的速度,可以取以下值:“slow”、“fast” 或毫秒。
可選的 callback 參數是隱藏或顯示完成后所執行的函數名稱。
//帶有 speed 參數的 hide() 方法: $("button").click(function(){$("p").hide(1000); }); //帶有 speed 參數的 hide() 方法,并使用回調函數: $(document).ready(function(){$(".hidebtn").click(function(){$("div").hide(1000,"linear",function(){alert("Hide() 方法已完成!");});}); });第二個參數是一個字符串,表示過渡使用哪種緩動函數。(jQuery自身提供 “linear” 和 “swing”,其他可以使用相關的插件)。
toggle()
使用 toggle() 方法來切換 hide() 和 show() 方法
//顯示被隱藏的元素,并隱藏已顯示的元素: $("button").click(function(){$("p").toggle(); });語法:
$(selector).toggle(speed,callback);
可選的 speed 參數規定隱藏/顯示的速度,可以取以下值:“slow”、“fast” 或毫秒。
可選的 callback 參數是隱藏或顯示完成后所執行的函數名稱。
1.$(selector)選中的元素的個數為n個,則callback函數會執行n次;
2.callback函數名后加括號,會立刻執行函數體,而不是等到顯示/隱藏完成后才執行;
3.callback既可以是函數名,也可以是匿名函數;
對于這里,當 callback 函數加上括號時,函數立即執行,只會調用一次, 如果不加括號,元素顯示或隱藏后調用函數,才會調用多次。
$(document).ready(function(){$(".hidebtn").click(function(){// popalert 不加括號() $("div").hide(1000,"linear",popalert)}); }); function popalert(){alert("Hide() 方法已完成!"); }2.淡入淡出
fadeIn() 用于淡入已隱藏的元素。
語法:
$(selector).fadeIn(speed,callback);
可選的 speed 參數規定效果的時長。它可以取以下值:“slow”、“fast” 或毫秒。
可選的 callback 參數是 fading 完成后所執行的函數名稱。
fadeOut() 方法用于淡出可見元素。
語法:
$(selector).fadeOut(speed,callback);
可選的 speed 參數規定效果的時長。它可以取以下值:“slow”、“fast” 或毫秒。
可選的 callback 參數是 fading 完成后所執行的函數名稱。
fadeToggle() 方法可以在 fadeIn() 與 fadeOut() 方法之間進行切換。
如果元素已淡出,則 fadeToggle() 會向元素添加淡入效果。
如果元素已淡入,則 fadeToggle() 會向元素添加淡出效果。
語法:
$(selector).fadeToggle(speed,callback);
可選的 speed 參數規定效果的時長。它可以取以下值:“slow”、“fast” 或毫秒。
可選的 callback 參數是 fading 完成后所執行的函數名稱。
fadeTo() 方法允許漸變為給定的不透明度(值介于 0 與 1 之間)。
語法:
$(selector).fadeTo(speed,opacity,callback);
必需的 speed 參數規定效果的時長。它可以取以下值:“slow”、“fast” 或毫秒。
fadeTo() 方法中必需的 opacity 參數將淡入淡出效果設置為給定的不透明度(值介于 0 與 1 之間)。
可選的 callback 參數是該函數完成后所執行的函數名稱。
fadeTo() 沒有默認參數,必須加上 slow/fast/Time
3.滑動
slideDown() 方法用于向下滑動元素。
語法:
$(selector).slideDown(speed,callback);
可選的 speed 參數規定效果的時長。它可以取以下值:“slow”、“fast” 或毫秒。
可選的 callback 參數是滑動完成后所執行的函數名稱。
callback為函數名,加括號觸發slideDown()立即執行,不加括號slideDown()完成后執行
slideUp() 方法用于向上滑動元素。
語法:
$(selector).slideUp(speed,callback);
可選的 speed 參數規定效果的時長。它可以取以下值:“slow”、“fast” 或毫秒。
可選的 callback 參數是滑動完成后所執行的函數名稱。
callback為函數名,加括號觸發slideUp()立即執行,不加括號slideUp()完成后執行
slideToggle() 方法可以在 slideDown() 與 slideUp() 方法之間進行切換。
如果元素向下滑動,則 slideToggle() 可向上滑動它們。
如果元素向上滑動,則 slideToggle() 可向下滑動它們。
$(selector).slideToggle(speed,callback);
可選的 speed 參數規定效果的時長。它可以取以下值:“slow”、“fast” 或毫秒。
callback為函數名,加括號觸發slideToggle()立即執行,不加括號slideToggle()完成后執行
4. 動畫
animate() 方法用于創建自定義動畫。
語法:
$(selector).animate({params},speed,callback);
必需的 params 參數定義形成動畫的 CSS 屬性。
可選的 speed 參數規定效果的時長。它可以取以下值:“slow”、“fast” 或毫秒。
callback為函數名,加括號觸發animate()立即執行,不加括號animate()完成后執行
5. stop() 方法用于停止動畫或效果,在它們完成之前。
stop() 方法適用于所有 jQuery 效果函數,包括滑動、淡入淡出和自定義動畫。
語法:
$(selector).stop(stopAll,goToEnd);
可選的 stopAll 參數規定是否應該清除動畫隊列。默認是 false,即僅停止活動的動畫,允許任何排入隊列的動畫向后執行。
可選的 goToEnd 參數規定是否立即完成當前動畫。默認是 false。
因此,默認地,stop() 會清除在被選元素上指定的當前動畫。
5. 方法鏈接
直到現在,我們都是一次寫一條 jQuery 語句(一條接著另一條)。
不過,有一種名為鏈接(chaining)的技術,允許我們在相同的元素上運行多條 jQuery 命令,一條接著另一條。
提示: 這樣的話,瀏覽器就不必多次查找相同的元素。
如需鏈接一個動作,您只需簡單地把該動作追加到之前的動作上。
下面的例子把 css()、slideUp() 和 slideDown() 鏈接在一起。“p1” 元素首先會變為紅色,然后向上滑動,再然后向下滑動:
五. jQuery html
1. 獲取內容和屬性
獲取內容
text() - 設置或返回所選元素的文本內容
html() - 設置或返回所選元素的內容(包括 HTML 標簽)
val() - 設置或返回表單字段的值
獲取屬性
attr() 方法用于獲取屬性值。
$("button").click(function(){alert($("#run").attr("href")); });對于 HTML 元素本身就帶有的固有屬性,在處理時,使用 prop 方法。
對于 HTML 元素我們自己自定義的 DOM 屬性,在處理時,使用 attr 方法。
prop()函數的結果:
1.如果有相應的屬性,返回指定屬性值。
2.如果沒有相應的屬性,返回值是空字符串。
attr()函數的結果:
1.如果有相應的屬性,返回指定屬性值。
2.如果沒有相應的屬性,返回值是 undefined。
2. 設置內容和屬性
設置內容
text() - 設置或返回所選元素的文本內容
html() - 設置或返回所選元素的內容(包括 HTML 標記)
val() - 設置或返回表單字段的值
text()、html() 以及 val(),同樣擁有回調函數。回調函數有兩個參數:被選元素列表中當前元素的下標,以及原始(舊的)值。然后以函數新值返回您希望使用的字符串。
$("#btn1").click(function(){$("#test1").text(function(i,origText){return "舊文本: " + origText + " 新文本: Hello world! (index: " + i + ")"; }); });$("#btn2").click(function(){$("#test2").html(function(i,origText){return "舊 html: " + origText + " 新 html: Hello <b>world!</b> (index: " + i + ")"; }); });設置屬性
attr() 方法也用于設置/改變屬性值。
$("button").click(function(){$("a").attr("href","http://www.xxxxx.com"); }); //attr() 方法也允許您同時設置多個屬性。 $("button").click(function(){$("#run").attr({"href" : "http://www.xxx.com","title" : "jQuery 教程"}); });jQuery 方法 attr(),也提供回調函數。回調函數有兩個參數:被選元素列表中當前元素的下標,以及原始(舊的)值。然后以函數新值返回您希望使用的字符串。
$("button").click(function(){$("#run").attr("href", function(i,origValue){return origValue + "/jquery"; }); });3.添加元素
在選中元素內添加
append() - 在被選元素的結尾插入內容
prepend() - 在被選元素的開頭插入內容
after() - 在被選元素之后插入內容
before() - 在被選元素之前插入內容
在選中元素外添加
after() 和 before() 方法
jQuery after() 方法在被選元素之后插入內容。
jQuery before() 方法在被選元素之前插入內容。
after() 和 before() 方法能夠通過參數接收無限數量的新元素。可以通過 text/HTML、jQuery 或者 JavaScript/DOM 來創建新元素
4. 刪除元素/或內容
remove() - 刪除被選元素(及其子元素)
empty() - 從被選元素中刪除子元素
過濾被刪除的元素
remove() 方法也可接受一個參數,允許您對被刪元素進行過濾。
該參數可以是任何 jQuery 選擇器的語法。
5. 獲取并設置 Class 類
addClass() - 向被選元素添加一個或多個類
removeClass() - 從被選元素刪除一個或多個類
toggleClass() - 對被選元素進行添加/刪除類的切換操作
addClass()
//向不同的元素添加 class 屬性。當然,在添加類時,您也可以選取多個元素 $("button").click(function(){$("h1,h2,p").addClass("blue");$("div").addClass("important"); }); //在 addClass() 方法中規定多個類 $("button").click(function(){$("body div:first").addClass("important blue"); });removeClass()
//在不同的元素中刪除指定的 class 屬性 $("button").click(function(){$("h1,h2,p").removeClass("blue"); });toggleClass()
//使用 jQuery toggleClass() 方法。該方法對被選元素進行添加/刪除類的切換操作 $("button").click(function(){$("h1,h2,p").toggleClass("blue"); });5. css()方法
css() 方法設置或返回被選元素的一個或多個樣式屬性。
返回css屬性
//返回首個匹配元素的 background-color 值: $("p").css("background-color"); //獲取更多元素的值 $(function() {$("button").click(function() {for(var i = 0; i < $("p").length; i++){alert($("p").eq(i).css("background-color"));//.eq()根據索引獲取}}); });設置單個css屬性
$("p").css("background-color","yellow");設置多個css屬性
//使用對象形式傳入數據 $("p").css({"background-color":"yellow","font-size":"200%"});六. 遍歷dom
1. 祖先
parent()返回被選元素的直接父元素。
$(document).ready(function(){$("span").parent(); });parents() 方法返回被選元素的所有祖先元素,它一路向上直到文檔的根元素 (<html>)
$(document).ready(function(){$("span").parents(); }); //使用可選參數來過濾對祖先元素的搜索 $(document).ready(function(){$("span").parents("ul"); });parentsUntil() 方法返回介于兩個給定元素之間的所有祖先元素。
$(document).ready(function(){$("span").parentsUntil("div"); });2.后代
children() 方法返回被選元素的所有直接子元素,該方法只會向下一級對 DOM 樹進行遍歷。
$(document).ready(function(){$("div").children(); }); //使用可選參數來過濾對子元素的搜索 //下面的例子返回類名為 "1" 的所有 <p> 元素,并且它們是 <div> 的直接子元素: $(document).ready(function(){$("div").children("p.1"); });find() 方法返回被選元素的后代元素,一路向下直到最后一個后代
//返回屬于 <div> 后代的所有 <span> 元素 $(document).ready(function(){$("div").find("span"); }); //返回 <div> 的所有后代 $(document).ready(function(){$("div").find("*"); });3. 同胞
siblings() 方法返回被選元素的所有同胞元素。
//返回 <h2> 的所有同胞元素 $(document).ready(function(){$("h2").siblings(); }); //也可以使用可選參數來過濾對同胞元素的搜索。 //下面的例子返回屬于 <h2> 的同胞元素的所有 <p> 元素: $(document).ready(function(){$("h2").siblings("p"); });next() 方法返回被選元素的下一個同胞元素。
//返回 <h2> 的下一個同胞元素 $(document).ready(function(){$("h2").next(); });nextAll() 方法返回被選元素的所有跟隨的同胞元素。
//返回 <h2> 的所有跟隨的同胞元素 $(document).ready(function(){$("h2").nextUntil("h6"); });nextUntil() 方法返回介于兩個給定參數之間的所有跟隨的同胞元素。
$(document).ready(function(){$("h2").nextUntil("h6"); });prev(), prevAll() & prevUntil() 方法
prev(), prevAll() 以及 prevUntil() 方法的工作方式與上面的方法類似,只不過方向相反而已:它們返回的是前面的同胞元素(在 DOM 樹中沿著同胞之前元素遍歷,而不是之后元素遍歷)
4. 過濾
first()、last()、eq()、filter()、not()
first() 方法返回被選元素的首個元素。
$(document).ready(function(){$("div p").first(); });last() 方法返回被選元素的最后一個元素。
$(document).ready(function(){$("div p").last(); });eq() 方法返回被選元素中帶有指定索引號的元素。
$(document).ready(function(){$("p").eq(1); });filter() 方法允許您規定一個標準。不匹配這個標準的元素會被從集合中刪除,匹配的元素會被返回。
//返回帶有類名 "url" 的所有 <p> 元素 $(document).ready(function(){$("p").filter(".url"); });not() 方法返回不匹配標準的所有元素。
//返回不帶有類名 "url" 的所有 <p> 元素 $(document).ready(function(){$("p").not(".url"); });擴展
not 和 eq 可以實現反選的效果。
選取索引值不為 1 的 p 元素,并把背景顏色設置為黃色:
七. jQuery ajax
1. load()
load() 方法從服務器加載數據,并把返回的數據放入被選元素中。
語法:
$(selector).load(URL,data,callback);
必需的 URL 參數規定您希望加載的 URL。
可選的 data 參數規定與請求一同發送的查詢字符串鍵/值對集合。
可選的 callback 參數是 load() 方法完成后所執行的函數名稱。
可選的 callback 參數規定當 load() 方法完成后所要允許的回調函數。回調函數可以設置不同的參數:
responseTxt - 包含調用成功時的結果內容
statusTXT - 包含調用的狀態
xhr - 包含 XMLHttpRequest 對象
2. get()和post()
$.get() 方法通過 HTTP GET 請求從服務器上請求數據
語法:
$.get(URL,callback);
或
$.get( URL, data , callback, dataType )
| URL | 發送請求的 URL字符串。 |
| data | 可選的,發送給服務器的字符串或 key/value 鍵值對。 |
| callback | 可選的,請求成功后執行的回調函數。 |
| dataType | 可選的,從服務器返回的數據類型。默認:智能猜測(可以是 |
$.post() 方法通過 HTTP POST 請求向服務器提交數據。
語法:
$.post(URL,callback);
或
$.post( URL , data , callback , dataType )
| URL | 發送請求的 URL字符串。 |
| data | 可選的,發送給服務器的字符串或 key/value 鍵值對。 |
| callback | 可選的,請求成功后執行的回調函數。 |
| dataType | 可選的,從服務器返回的數據類型。默認:智能猜測(可以是xml, json, script, 或 html)。 |
GET 和 POST 方法的區別:
1、發送的數據數量
在 GET 中,只能發送有限數量的數據,因為數據是在 URL 中發送的。
在 POST 中,可以發送大量的數據,因為數據是在正文主體中發送的。
2、安全性
GET 方法發送的數據不受保護,因為數據在 URL 欄中公開,這增加了漏洞和黑客攻擊的風險。
POST 方法發送的數據是安全的,因為數據未在 URL 欄中公開,還可以在其中使用多種編碼技術,這使其具有彈性。
3、加入書簽中
GET 查詢的結果可以加入書簽中,因為它以 URL 的形式存在;而 POST 查詢的結果無法加入書簽中。
4、編碼
在表單中使用 GET 方法時,數據類型中只接受 ASCII 字符。
在表單提交時,POST 方法不綁定表單數據類型,并允許二進制和 ASCII 字符。
5、可變大小
GET 方法中的可變大小約為 2000 個字符。
POST 方法最多允許 8 Mb 的可變大小。
6、緩存
GET 方法的數據是可緩存的,而 POST 方法的數據是無法緩存的。
7、主要作用
GET 方法主要用于獲取信息。而 POST 方法主要用于更新數據。
八.其他
1. noConflict() ,釋放jQuery對$符號的控制
jQuery 使用 $ 符號作為 jQuery 的簡寫。
其他一些 JavaScript 框架包括:MooTools、Backbone、Sammy、Cappuccino、Knockout、JavaScript MVC、Google Web Toolkit、Google Closure、Ember、Batman 以及 Ext JS。
其中某些框架也使用 $ 符號作為簡寫(就像 jQuery),如果您在用的兩種不同的框架正在使用相同的簡寫符號,有可能導致腳本停止運行。
jQuery 的團隊考慮到了這個問題,并實現了 noConflict() 方法。
noConflict() 方法會釋放對 $ 標識符的控制,這樣其他腳本就可以使用它了。
//通過全名替代簡寫的方式來使用 jQuery $.noConflict(); jQuery(document).ready(function(){jQuery("button").click(function(){jQuery("p").text("jQuery 仍然在工作!");}); }); //也可以創建自己的簡寫。noConflict() 可返回對 jQuery 的引用,您可以把它存入變量,以供稍后使用。 var jq = $.noConflict(); jq(document).ready(function(){jq("button").click(function(){jq("p").text("jQuery 仍然在工作!");}); }); //如果你的 jQuery 代碼塊使用 $ 簡寫,并且您不愿意改變這個快捷方式,那么您可以把 $ 符號作為變量傳遞給 ready 方法。這樣就可以在函數內使用 $ 符號了 - 而在函數外,依舊不得不使用 "jQuery": $.noConflict(); jQuery(document).ready(function($){$("button").click(function(){$("p").text("jQuery 仍然在工作!");}); });總結
以上是生活随笔為你收集整理的jQuery详细教程,基础内容罗列的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 赋予金融科技人性化 易通贷召开品牌重塑发
- 下一篇: 海康NCG联网网关设备通过国标接入到Ea