具有不同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中文网其他相关文章！