Как запретить считывание html в тексте

<xmp> 
  <h1>asdasd</h1> 
  <p>1</p> 
  <p>2</p> 
  <p>3</p> 
</xmp>

Тег script стандартный, и работает во всех браузерах...
Он не только для кода. Фактически, в этом теге может быть любое текстовое содержимое.
Главное указать MIME-тип, чтобы браузер не воспринимал содержимое как код:

document.querySelector('#show').addEventListener('click', e => { 
  const hc = document.querySelector('#hidden-content');  
  e.target.parentElement.textContent = hc.innerHTML; // ◀ 
}); 

div { white-space: pre-line; }

<p>Видим на странице</p> 
<div> 
  <button id="show">Показать скрытое как текст</button> 
</div> 
 
<!-- Невидимый контент --> 
<script type="text/html" id="hidden-content"> 
  <p>Lorem ipsum dolor sit amet</p> 
</script>

Единственное что нельзя помещать в такой элемент - это вложенные script (из-за закрывающего тега).

Обратите внимание на тег <pre>. Но у него есть некоторый ограничения на использование следующих тегов <big>, <img>, <object>, <small>, <sub>, <sup>.

Если использовать только html, то только при использовании тега <plaintext> код будет выводиться как есть без его применения. Однако тег не входит в спецификацию. Верстка станет невалидной.

<plaintext>Этот тег<br>выведется как есть</plaintext>

Код лучше предварительно обработать на сервере при помощи функций, которые вернут текст с сущностями, тогда всё будет как надо. Например, в PHP:

echo htmlentities("Этот тег<br>выведется как есть", ENT_QUOTES);