Динамически добавлять HTML при нажатии на веб-странице усилителя

Question

Возможно ли динамическое добавление HTML на веб-страницу по щелчку при использовании AMP?

Что-то вроде

<button on="tap:AMP.setState({foo: 'amp-bind'})">Say "Hello amp- 
bind"</button>

<div [text]="foo">This is the placeholder to append the new 
content</div>

Но вместо текстового HTML?

Answer 1

Содержимое HTML известно заранее или генерируется динамически на основе пользовательского ввода?Если первое, чем оно может присутствовать на странице, но не видно, и вы можете контролировать его видимость с помощью amp-bind и CSS.Если нет, то да amp-script будет решением.Обратите внимание, что это в настоящее время в экспериментальной.

Answer 2

То, что вам нужно, может быть достигнуто с помощью amp-script.

https://github.com/ampproject/amphtml/blob/master/extensions/amp-script/amp-script.md

Из GitHub:

<!-- hello-world.html -->
<amp-script layout="container" src="https://example.com/hello-world.js">
  <button id="hello">Insert Hello World!</button>
</amp-script>


// hello-world.js
const button = document.getElementById('hello');
button.addEventListener('click', () => {
  const el = document.createElement('h1');
  el.textContent = 'Hello World!';
  // `document.body` is effectively the <amp-script> element.
  document.body.appendChild(el);
});