javascript - 如何在加速移动页面(AMP)中使用 javascript?
问题描述
我正在尝试使用 Javascript 创建一个加速的移动页面 (AMP)。AMP 验证器显示名为“不允许自定义 JavaScript”的错误。
我试过下面的代码。
<!doctype html>
<html amp>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,minimum-scale=1">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<meta name="amp-script-src" content="sha384-vk5WoKIaW_vJyUAd9n_wmopsmNhiy-L2Z-SBxGYnUkunIxVxAv_UtMOhba_xskxh">
<title>Document</title>
<link rel="canonical" href="/" />
<script async src="https://cdn.ampproject.org/v0.js"></script>
<script async custom-element="amp-script" src="https://cdn.ampproject.org/v0/amp-script-0.1.js"></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 script="local-script">
<button>Hello amp-script!</button>
</amp-script>
<script target="amp-script" type="text/plain" id="local-script">
console.log('js added')
</script>
</body>
</html>
我需要找到一些可能的解决方案来使用 Javascript 处理 AMP。AMP 验证器需要保持干净,因为它显示 1 个错误“不允许自定义 JavaScript”,我无法从上述代码中找到原因。
解决方案
推荐阅读
- sql - 单个 listagg 中的多个列
- c# - 表达式匿名类型
- java - 使用 Firebase ChildEventListener 的问题
- javascript - JSON - 对象中的数组中的对象 - 如何使用 JS 通过循环解析?
- python - 如何使用 html 在 python 中从 web 导入表格?
- php - php形式。表单验证。名字查
- scala - 迭代 Spark Dataframe 运行缓慢
- javascript - 如何填充第一个日期和最后一个日期之间的日期?
- postgresql - 用时区减去两列时间戳类型
- twitter-bootstrap - 如何在 Bootstrap 4 和 Sass 中设置自定义按钮文本颜色?