＜ 前の記事
jQuery - mouseenterイベント、mouseoverイベント、mouseleaveイベント、mouseoutイベント
次の記事 ＞
jQuery - focusイベント、focusinイベント、blurイベント、focusoutイベント
jQuery - 画面にログ表示
公開日：2018-12-28
更新日：2019-05-14
更新日：2019-05-14
1. 概要
コンソールではなく、画面にログを表示します。
2. サンプル
<!DOCTYPE html><html><head><meta charset="UTF-8"><title>jQuery</title><style>body{color:#fff; background-color:#000;}</style></head>
<body>
<script src="https://code.jquery.com/jquery-3.3.1.min.js" integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=" crossorigin="anonymous"></script>
<input type="button" value="クリックするとログ出力します" onclick="log('ログ')" />
<hr />
<div id="log"></div>
<script>
//ログ出力
var no = 1;
function log(msg) {
//ログを1行追加します
$("#log").append ('<div>' + no++ + ":" + msg + '</div>');
//ログの要素が10個より多くなった場合は、先頭の要素を削除します
if ($("#log div").length > 10) {
$("#log div:first").remove();
}
}
</script>
</body></html>
実行結果：画面
