JSFiddle - React, Tailwind, and code Playground

by tea4two

HTML

<p><a href="#box" id="link">リンク</a></p>
<p><button id="timerStop">タイマーストップ</button></p>
<p>あいうえお</p>
<p>あいうえお</p>
<p>あいうえお</p>
<p>あいうえお</p>
<p>あいうえお</p>
<p>あいうえお</p>
<p>あいうえお</p>
<p>あいうえお</p>
<p>あいうえお</p>
<p>あいうえお</p>
<p>あいうえお</p>
<p>あいうえお</p>
<p>あいうえお</p>
<p>あいうえお</p>
<p>あいうえお</p>
<p>あいうえお</p>
<p>あいうえお</p>
<p>あいうえお</p>
<p>あいうえお</p>
<p>あいうえお</p>
<p>あいうえお</p>
<p>あいうえお</p>
<p>あいうえお</p>
<p>あいうえお</p>
<p>あいうえお</p>
<p>あいうえお</p>
<p>あいうえお</p>
<p>あいうえお</p>
<p>あいうえお</p>
<p>あいうえお</p>
<p>あいうえお</p>
<p>あいうえお</p>
<p>あいうえお</p>
<p>あいうえお</p>
<p>あいうえお</p>
<p>あいうえお</p>
<p>あいうえお</p>
<p>あいうえお</p>
<p>あいうえお</p>
<p>あいうえお</p>
<p>あいうえお</p>
<p>あいうえお</p>
<p>あいうえお</p>
<p>あいうえお</p>
<p>あいうえお</p>
<p>あいうえお</p>
<p>あいうえお</p>
<p>あいうえお</p>
<p>あいうえお</p>
<p>あいうえお</p>
<p id="box">ボックス</p>
<p>あいうえお</p>
<p>あいうえお</p>
<p>あいうえお</p>
<p>あいうえお</p>
<p>あいうえお</p>
<p>あいうえお</p>
<p>あいうえお</p>
<p>あいうえお</p>
<p>あいうえお</p>
<p>あいうえお</p>
<p>あいうえお</p>
<p>あいうえお</p>
<p>あいうえお</p>
<p>あいうえお</p>
<p>あいうえお</p>

JavaScript

var $link = $('#link');


$link.on('click', function(event){
	console.dir(event);
	alert('クリックしました！');
  event.preventDefault();
});


var i = 0;
var timerId = setInterval(function(){
	i++;
	console.log(i);
}, 1000);

console.log('タイマーIDは ', timerId);

var $btnTimerStop = $('#timerStop');
$btnTimerStop.on('click', function(){
	clearInterval(timerId);
});



var example;
console.log(example);

example = example + '<a href="#"></a>';

console.log(example);