2020-04-01から1ヶ月間の記事一覧
marginを上手く使って余白と中央揃えをする時の設計の考え marginの管理方法まとめ 続く
Zoomを使用した授業のオンライン化について記事を書きました。 https://note.com/kirikko/n/n99a006db0ac5先日桐生市内で個人塾をしている知人からコロナで仕事が出来ず生徒さんの親御さんと共に困っていると相談を受けました。スマホを使用したことの無い友…
今回はjs操作でimgタグを作るやり方を以下に let img = document.createElement('img'); img.className =`card spade sapde${i} ${i}`; img.id = ''; img.setAttribute ('src','images/front.png'); img.onclick =clickFunc; １。let img document.createEle…
sprit();は()内に入れた引数を区切りとして文字列を配列に変換してくれる。 例）const t = 'aaa9bbb9ccc9ddd';console.log(t.split('9'));これのコンソールの結果は ["aaa", "bbb", "ccc", "ddd"]となる。 上記は文字列を引数である「９」で区切った結果が表…
配列についてググっている時に「...arr〇〇✖︎✖️〜〜〜〜」というように何やら「...」が使われたコードがある。 でもこれ何？ となりました。 ...でググっても出てこなかったのですが。 ドットインストールにて発見 参考：js オブジェクト編＃６スプレット構…
この記事の続きです kirikko-scondcube.hatenablog.com 今回使用したものはFisher–Yatesアルゴリズム 参考：https://qiita.com/komaji504/items/62a0f8ea43053e90555a?fbclid=IwAR2p_kxgQoehQXpfLbMjGXwMYDoWs5ycEjGku52rMAIPHTCcZ6ppLmyjs64 内容は以下 for…
この記事の続きです。 kirikko-scondcube.hatenablog.com 今日のコード html <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <link rel="stylesheet" href="css/style.css"> </head> <body> <div id="palet"></div> </body></html>
現在のコード 現在の結果 html <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <link rel="stylesheet" href="css/style.css"> </head> <body> <div id="palet"></div> <div id="result">ここに経過時間が読み込まれるようにする</div></body></html>
以下の続きです 今回は削除について kirikko-scondcube.hatenablog.com kirikko-scondcube.hatenablog.com 既存のul-liの要素から指定したli（今回はitem1 ）を削除する記述 html <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </meta></meta></head></html>
前回の投稿の続きです kirikko-scondcube.hatenablog.com 今回は既存のli要素item0をコピーしてitem2とitem1の間にコピーしたitem0を挿入する処理 挿入前 挿入後 html <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </meta></meta></head></html>
表題の件 runボタンを押すとitem2が追加されるコード jsの各処理についてコメントしたことを忘れないようにする 要素の追加には １。li要素を作る ２。中身のテキストを設定する ３。DOMツリーに追加する（今回でいうul内のliタグの一覧にセット） 以上の手…
最近キータイピングの練習を改めて始めたので、その記録用ブログです。 始めたのはこちら https://www.typingclub.com/ タイピングクラブ 無料でタイピングを練習出来る。 レベル別で特に数字や記号を練習出来るのがとても良い 苦手だとわかったキー 1と0 続…
先日失敗した以下の記事でのfirebaseのdeployが解決し、無事にアップできました。 kirikko-scondcube.hatenablog.com 結果：https://kirikkohp.web.app/ ↑デプロイしたもの 今回の解決に直結した記事 https://qiita.com/kitikitchen/items/78b526d4a3a2bb14f…
先日成功したfirebaseによるデプロイに今日は失敗した。 やり方はこちらを参考にし前回は出来た 参考：https://webdesign-trends.net/entry/9692 手順は １。node.jsのインストール npm -vでバージョンがターミナルで表示されればOK ２。firebaseのインスト…
ドットインストールの三択クイズを作る動画視聴時にこんな記載が question.textContent = quizSet[currentNum].q; quizSet[currentNum].c.forEach(choice => { const li = document.createElement('li'); li.textContent = choice; choices.appendChild(li);…
以前のブログで記載のジェンケンゲーム ジャンケンゲーム こちらの処理を簡略化する方法をアドバイス頂きましたので記載します。 内容は jsファイルにて相手の手の表示とジャンケンの判定結果をそれぞれif文で記載していたのですが、それを一つにまとめられ…
初めてのジャンケンゲーム ドットインストールのおみくじゲームをベースに作成しました。 cssなしのジャンケンゲーム コードは以下 html <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <link rel="stylesheet" href="css/style.css"> </head> <body> <h1>ジャンケンゲーム…</h1></body></html>
