Question

我的网页包含多个外部CSS，外部js和jQuery只放在html文件中。我想将整个页面转换为AMP。可能吗？我看过教程，发现脚本标签可以转换为AMP。我可以将以下脚本标记更改为AMP吗？如果是，怎么样？

  <script src="./MyWebsite_files/jquery.flexslider.js.download"></script>
<script async custom-element="amp-iframe">
    $(window).load(function () {
        $('.flexslider').flexslider({
            animation: "slide"
        });
    });
</script>
<script>
   function contclick(){
        $(".mov-etm").hide();
   }

   $( function() {
      $( "#datepicker" ).datepicker();
   } );
</script>
<script>
  (function(i,s,o,g,r,a,m)
  {i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
      (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new 
       Date();a=s.createElement(o),
        m=s.getElementsByTagName(o)
         [0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
     })(window,document,'script','https://www.google-
        analytics.com/analytics.js','ga');

     ga('create', 'UA-20183208-1', 'auto');
     ga('send', 'pageview');

 </script>

帮助表示赞赏。对于这个AMP来说，我是全新的。

Answer 1

根据您提供的代码，您可以使用可实现目标的AMP组件。

对于滑块，您可以使用amp-carousel
对于Google分析代码，请使用amp-analytics
对于日期选择器，似乎没有什么具体但我建议你结帐 ampbyexample.com因为可能有哪些组件会对你做什么想。

虽然您无法直接在AMP页面上包含脚本标记，但可以使用服务工作者向页面添加脚本。但这是一个相当复杂的模式，适用于Progressive Web-Apps，而不是用于添加组件。amp-install-serviceworker。

您还可以使用i-frame添加互动内容，这可能是日期选择器所需的内容How to embed interactive elements on AMP pages?

我们如何将脚本标记转换为AMP以获得完整的网页

1 个答案: