如何在 AMP 上实现 Jquery？

Question

我尝试在 AMP 页面上使用 JQuery。

例如，我已经满足script/HTML耳放等耳放要求

举个例子：

const button = document.getElementById('hello-url');

button.addEventListener('click', () => {
    console.log('clicked');
  const h1 = document.createElement('h1');
  h1.textContent = 'Hello World!';
  document.body.appendChild(h1);
});

<!DOCTYPE html>
<html amp lang="en">
  <head>
    <meta charset="utf-8">
    <script async src="https://cdn.ampproject.org/v0.js"></script>
    <title>Hello, AMPs</title>
    <link rel="canonical" href="https://amp.dev/documentation/guides-and-tutorials/start/create/basic_markup/">
    <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
    <script async custom-element="amp-script" src="https://cdn.ampproject.org/v0/amp-script-0.1.js"></script>
    <meta name="amp-script-src" content="sha384-ZvpUoO_-PpLXR1lu4jmpXWu80pZlYUAfxl5NsBMWOEPSjUn_6Z_hRTt8-pR6L4N2">
    <script type="application/ld+json">
      {
        "@context": "http://schema.org",
        "@type": "NewsArticle",
        "headline": "Open-source framework for publishing content",
        "datePublished": "2015-10-07T12:02:41Z",
        "image": [
          "logo.png"
        ]
      }
    </script>
    <style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
  </head>
  <body>
    <amp-script src="js" layout="container">
        <div id="hello-url">
            Say Hello
        </div>
    </amp-script>
  </body>
</html>

它适用于 vanilla js，但在 Jquery 上实现如何？如何实现？

<amp-script src="https://code.jquery.com/jquery-3.5.1.min.js" layout="container">
    <div id="hello-url">
        Say Hello
    </div>
<script>
  $jquerycode with same fuction
</script>
</amp-script>

Answer 1

外部 Java 像 jQuery 这样的脚本是 forbidden in AMP. Except for AMP-Iframe or custom Javascript。

如何在 AMP 上实现 Jquery？

How to implement Jquery on AMP?

jquery

amp-html