成人无码视频,亚洲精品久久久久av无码,午夜精品久久久久久毛片,亚洲 中文字幕 日韩 无码

資訊專欄INFORMATION COLUMN

自定義標(biāo)簽的編碼

ernest.wang / 1614人閱讀

摘要：，，優(yōu)化樣式插入自定義標(biāo)簽官方示例思考自定義標(biāo)簽的使用減少了我們頻繁編寫一堆冗余深層嵌套的代碼，提高了速率。

customElements.define

在MDN官方文檔中，如果你想要使用自定義標(biāo)簽，可以使用customElement類中define方法（IE7以下瀏覽器不支持），
使用：customElements.define("myselfTagName", myselfClass, extendsObj);
參數(shù)：

myselfTagName: 自定義標(biāo)簽名
myselfClass: 自定義標(biāo)簽的類對象，（主要功能在這里實現(xiàn)，一般在自定義標(biāo)簽綁定變量、事件、指令或者是渲染條件）
extendsObj: 內(nèi)置并繼承的元素（包裹著自定義標(biāo)簽的對象，一般不使用，畢竟誰會閑的無聊把基本標(biāo)簽封裝成自定義標(biāo)簽然后填充一堆屬性，語義化也說不通?。?/pre>
attachShadow

官方文檔對于shadow  DOM解釋很模糊，簡單的說就是DOM的"一體雙魂"，擁有同樣的函數(shù)和方法，但是Shadow DOM比被附加DOM更多的功能，前者具有獨自的作用域，并且與外界DOM分隔。（這個作用就是shadow DOM的核心功能，它可以使你編寫的DOM與css與其他區(qū)域互不影響，相當(dāng)于vue中css樣式的作用）；
shadow DOM彌補(bǔ)了customElements缺少隔離作用域（DOM和css作用域）的缺陷。


shadom DOM Root的創(chuàng)建方法： this.attachShadow({mode: "open"});


this: shadom DOM對象
mode: 開啟js調(diào)用shadow DOM

代碼示范

coding.... 莫道征途路漫漫



  
    
    Pop-up info box — web components
  
  
    
Pop-up info widget - web components


    

      

        
        
      

    

  
  



官方示例
MDN CODE

思考

自定義標(biāo)簽的使用減少了我們頻繁編寫一堆冗余、深層嵌套的代碼，提高了速率。然而，如果我們看頁面源碼會發(fā)現(xiàn)customElements.define不會消除自定義標(biāo)簽，自定義標(biāo)簽如果綁定了大量的數(shù)據(jù)、事件、敏感信息，頁面上又完全顯示出來，這就增加前端頁面的不安全性。如何保證開發(fā)者即使用自定義標(biāo)簽又不會編譯自定義標(biāo)簽從而導(dǎo)致DOM的過度掛載和數(shù)據(jù)的泄漏（不建議remove自定義標(biāo)簽，頻繁操作DOM太消耗內(nèi)存了），值得思考...

文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://m.hztianpu.com/yun/102400.html

相關(guān)文章

  • 自定義標(biāo)簽的編碼

    摘要：，，優(yōu)化樣式插入自定義標(biāo)簽官方示例思考自定義標(biāo)簽的使用減少了我們頻繁編寫一堆冗余深層嵌套的代碼，提高了速率。 customElements.define 在MDN官方文檔中，如果你想要使用自定義標(biāo)簽，可以使用customElement類中define方法（IE7以下瀏覽器不支持），使用：customElements.define(myselfTagName, myselfClass, ...

    chaosx110 評論0 收藏0

  • HTML編碼規(guī)范建議

    摘要：示例強(qiáng)制對中規(guī)定允許省略的閉合標(biāo)簽，不允許省略閉合標(biāo)簽。示例圖片強(qiáng)制禁止的取值為空。示例提交取消取消提交建議當(dāng)使用進(jìn)行表單提交時，如果條件允許，應(yīng)使原生提交功能正常工作。示例建議模板代碼應(yīng)以保證單個標(biāo)簽語法的正確性為基本原則。 這段時間在整理前端部分代碼規(guī)范，初步想法是從HTML、CSS、Javascipt、項目文件目錄四部分是整理。之前已經(jīng)整理完了CSS編碼規(guī)范，有興趣可以了解下 1...

    sunnyxd 評論0 收藏0

  • 機(jī)器學(xué)習(xí)“特征編碼”的經(jīng)驗分享：魚還是熊掌？

    摘要：特征編碼類型本篇，我們主要說一下分類型特征的編碼方式。下面，我們要對這個變量進(jìn)行編碼，在中有現(xiàn)成的獨熱編碼方法，代碼如下原來的變量被拆分為兩個單獨的變量，這兩個變量就是原來的分類特征值有電梯和無電梯。 作者：xiaoyu 微信公眾號：Python數(shù)據(jù)科學(xué) 知乎：python數(shù)據(jù)分析師 showImg(https://segmentfault.com/img/remote/146000...

    trilever 評論0 收藏0

  • 機(jī)器學(xué)習(xí)“特征編碼”的經(jīng)驗分享：魚還是熊掌？

    摘要：特征編碼類型本篇，我們主要說一下分類型特征的編碼方式。下面，我們要對這個變量進(jìn)行編碼，在中有現(xiàn)成的獨熱編碼方法，代碼如下原來的變量被拆分為兩個單獨的變量，這兩個變量就是原來的分類特征值有電梯和無電梯。 作者：xiaoyu 微信公眾號：Python數(shù)據(jù)科學(xué) 知乎：python數(shù)據(jù)分析師 showImg(https://segmentfault.com/img/remote/146000...

    JinB 評論0 收藏0

發(fā)表評論

0條評論

閱讀需要支付1元查看
<