今後講義でこのブログを使う予定なので、任意のJavaScriptコードを実行できるようにした。
<div>
<input type="number" id="a">
<span>+</span>
<input type="number" id="b">
<span>=</span>
<span id="ans"></span>
<br>
<input type="button" value="calc" id="calc">
</div>
JavaScript
document.getElementById("calc").onclick = function(){
let a = parseInt(document.getElementById("a").value,10);
let b = parseInt(document.getElementById("b").value,10);
document.getElementById("ans").innerHTML = a+b;
}
cdnからライブラリを読み込んだりも可能
コード
HTML
<canvas id="myChart"></canvas>
JavaScript
if(typeof(script) == "undefined"){
let script = document.createElement('script');
script.src = "https://cdn.jsdelivr.net/npm/chart.js"
document.head.append(script);
script.onload = function() {
createChart();
};
}else{
createChart();
}
function createChart(){
new Chart(document.getElementById('myChart'), {
type: 'pie',
data: {
labels: ['A', 'B', 'C'],
datasets: [{
label: '割合',
data: [20,50,30],
backgroundColor: [
'rgb(255, 99, 132)',
'rgb(54, 162, 235)',
'rgb(255, 205, 86)'
],
hoverOffset: 4
}]
},
});
}
JamStackでもアクセスカウンターを実装したい
2021年12月13日(月) 3時21分10秒 | 315 viewページビュー数を表示する
2021年11月6日(土) 15時27分55秒 | 178 viewactions-js/push@masterでのデフォルトブランチがmasterからmainに変わっていてCIが動かなくなっていた
2021年8月30日(月) 8時49分10秒 | 74 viewテキストから一意の値を算出する
2020年10月27日(火) 14時9分41秒 | 33 viewtwitter埋め込み最適化テスト
2021年10月5日(火) 13時48分18秒 | 14 view