JSFiddle - React, Tailwind, and code Playground

by Valentin Sarychev

HTML

<div id="test">
  <a href="#1" onclick="alert('#1')">#1</a>
</div>
<div id="go">
  Скорей кликай по <u>#1</u>!!!
</div>

CSS

a {
  display: inline-block;
  width: 50px;
  height: 50px;
  background: #f00;
  color: #fff;
  padding: 10px;
  border: 1px solid #000;
}

#go {
  display: none;
}

JavaScript

document.querySelector('#test').addEventListener('mouseenter', () => {
  // предлагаем кликнуть по ссылке #1
	document.querySelector('#go').style.display = 'block';
  
  setTimeout(() => {
    // нагружаем ЦПУ
    for (let i = 0; i < 90000; ++i) {
      sessionStorage.x = i;
    }

		// вставляем аналогичную ссылку #2 перед #1
    const a = document.createElement('a');
    a.href = '#2';
    a.text = '#2'
    a.setAttribute('onclick', 'alert("#2")');
    document.querySelector('#test').prepend(a);
  });
}, {
	once: true
});