具有不同HTML的Web組件，用於台式機和移動設備

克里斯蒂安·舍夫（Christian Schaefer）關於處理網絡廣告的文章很大。整個過程很有趣，首先記錄了廣告所面臨的所有挑戰，然後向每個挑戰提供了現代解決方案。

一個引起我眼球的代碼段是設計一種組件的簡單方法，該組件根據屏幕尺寸而呈現不同的HTML。

 <div>
  
    //帶有內聯腳本的移動廣告html代碼
  
  
    //帶有內聯腳本的桌面廣告html代碼
  
  <script>
    const ismobile = matchMedia（&#39;（Max-Device Width：20em）&#39;）。
    const ad = document.currentscript.closest（&#39;。ad&#39;）;
    const Content = ad
      。
      。內容;
    
    ad.AppendChild（document.importnode（content，true））;
  </script>
</div>

聰明的。雖然請注意，基督徒最終在文章中走了完全不同的路線。

這是我使用自定義元素並將JavaScript移至JavaScript'Cuz的相同代碼。

以上是具有不同HTML的Web組件，用於台式機和移動設備的詳細內容。更多資訊請關注PHP中文網其他相關文章！