zashii-1434

Stats of My Life(おいしい人生を味わうために、コツコツとチャレンジしたことを書くブログ)

JavaScript

JavaScript-Bootstrapレスポンシブデザインのサンプルコード

デモでもいいので簡単に自分がイメージしているプロダクトを形にしてみたいと思ったので、ネット上に無料サンプルとして公開されているコードを拝借しました。 ここから本格的に自分用にカスタマイズするには相当の理解力がないと駄目なので ソースを今キャ…

JavaScript-Bootstrap

Bootstrapはレスポンシブデザインが楽にできる実装できるフレームワークです。 ダウンロードしてセッティングも簡単にできるのもグッドだと思います。 techacademy.jp <html lang="ja"> <head> <title>Hello, world!</title> <meta charset="utf-8"> <meta name="viewport axc,//. " content="width=device-width, initial-scale=1, shrink-to-fit=no"> </meta></meta></head></html>

JavaScript-Mathオブジェクト

メモ randomとfloorの組み合わせで一定範囲内の乱数の整数を生成することができる <html> <head> <script> function minmax() { var n = document.getElementById("randomRange").value; var a = Math.min(3, n); var b = Math.max(3, n); var c = Math.max(3, Math.min(6, n));</head></html>…

JavaScript-setTimeoutとsetInterval

備忘 setTimeoutはミリ秒後に関数を1回呼び出す setTimeoutはミリ秒後に関数を繰り返し呼び出す <html> <head> <script> var timerId; function timeoutStart(){ //タイマーの開始 timerId = setTimeout(whattime, 3000); } function timeoutStop(){ clearTimeout(timerId); } </head></html>…

Java Script-Fisher-Yates shuffle

自分用メモです。 <html> <head> <script> Array.prototype.shuffle = function () { /*Fisher-Yatesというアルゴリズム*/ var i = this.length; while (i) { var j = Math.floor(Math.random() * i); var t = this[--i]; this[i] = this[j]; this[j] = t; } return this; } fun</head></html>…

JavaScript-オブジェクト

自分用メモ。 <html> <head> <style> .div { position: absolute; width:60px; height: 25px; color: green; top:50px; } </style> <script> var ufo; function init() { window.addEventListener("keydown",keydown); ufo = new UFO(document.getElementById("ufo"),100); } function keydown(</head></html>…

JavaScript-○×ゲーム

レイアウトがchromeだと崩れるのはなぜだろう。 トラブル対応も勉強ですね。 <html> <head> <style> .cell { widows: 100px;height: 100px; font-size: 60pt; text-align: center; } </style> <script> var count = 0; function clickMe(e) { if (count++ % 2 == 0) { e.textContent = "○"; } e</script></head></html>…

JavaScript-appendChildにアイテムを追加

コツコツ勉強です。 <html> <head> <script> function insertItem() { var container = document.getElementById("container"); var item = document.createElement("li"); item.textContent = "アイテムにリストを追加"; container.appendChild(item); } function removeItem()</head></html>…

JavaScript-摂氏と華氏を表示

超初級ですが、ソース書いてみたので自分用のメモとして残しておきます。cloud9からはてなブログに貼り付けするとインデントが崩れますね。 みんなどうしてるんだろう。 <html> <head> <script> function c2f(c){ var f = (9 / 5) * c + 32; return Math.floor(f); } function c</head></html>…

JavaScript_FullCalendarでカレンダー表示しました。

現在、cloud9にてEvernoteのToDoタスクデータを取得して、完了したToDo数をFullCalendarに表示させることができないか格闘中。 ・FullCalendar ------------------------------------------------------------------------------------------------ --------…

JavaScript_関数宣言4パターン記載

備忘として記載します。 それぞれの特徴の整理はこれからです。 //①functionコンストラクター経由で定義する var getTriangle = new Function('base', 'height', 'return base * height / 2;'); console.log(getTriangle(5,2)); //②functionとして定義する f…

JavaScript_FizzBuzz問題解いてみました。

機会があり改めて解いてみました。functionを利用したパターンです。 function fizzBuzz(i) { if ((i % 3 === 0) && (i % 5 === 0)) { return 'FizzBuzz'; } else if (i % 3 === 0) { return 'Fizz'; } else if (i % 5 === 0) { return 'Buzz'; } else { ret…

JavaScript_MyMemo(2次元配列セット方法&末尾にある空白文字を一括削除 + 改行セット)

// ①ary[3][2] の2次元配列を作成する var ary = new Array(3); for (y=0; y

JavaScript_MyMemo(createElement,createTextNode,appendChild,getElementById,addEventListener))

<html lang=ja> <head> <meta charset="utf-8"> <title>template</title> </head> <body> <input type="button" id="button" value="押してね" onclick="check()"> <script> //要素<p>作成方法 var hello = document.createElement("p"); //要素テキストノード作成 var text = document.createTextNode("aaaa") //bodyに表示 docume…</p></body></html>

JavaScript_MyMemo(ary[][](2次元配列)、Math.floor,Math.ceil,Math.round)

//①2次元配列セット方法(正しい方法かは不明) //1次配列line[]には次のように半角スペース、かつ文字列で2つの数字がセットされている // "1 2" ←0行目 // "3 4" ←1行目 // "5 6" ←2行目 // "7 8" ←3行目 //↑これを2次元配列に入れ直す場合の処理 //[[1][2]…

JavaScript_MyMemo(replace,split,indexOf,replace)

最近JavaSciptを触るようになりました。以下、自分用のメモ。 //①改行を削除する var line = chunk.replace(/\r?\n/g,""); //②改行削除 + 半角スペースで区切ったデータ配列を作成 var line = chunk.replace(/\r?\n/g,"").split(" "); //③文字列"A"が含まれ…