鶏口牛後な日々

魔法使い(なんでも作れるエンジニア)を目指してます。ブログは発散中

JavaScript

毎回キャッシュを読み込まずにページをロードするようにしたい

CSSやJavaScriptで、変更したのに、変更がきかない! あああああぁあ〜 なぜ〜〜〜〜〜えぇぇ〜 という思いをした方も多いのではないでしょうか。 エンジニアあるある。 そのたんびに、キャッシュを消して再読み込み! とかするわけですけれど、エンジニアは…

JavaScriptで前後の不要な空白を取り除く(trimメソッド)

JavaScriptで、前後に空白がいつの間にか入っていて思惑通り動作しない場合、 trim() を使って、不要な空白を取り除きましょう。 $text.trim(); でokです! trim($変数) じゃないことに注意です。 そんな基本的なミス、誰もしないって? うーむ、何度もして…

AjaxとMySQLとPHP Laravelで郵便番号から住所検索するボタンを実装する

全体像 めちゃめちゃ大まかには、HTML→データベース→PHP Laravel→JS の順で、それぞれ用意していく必要があります。 もう少しブレイクダウンします。↓ HTMLにフォームを用意し、郵便番号入力欄と住所入力欄と検索ボタンを作る MySQLに、郵便番号と住所のテー…

javascriptの名前空間、超初心者向け導入

javascriptでは、初心者に少し毛が生えたくらいで、グローバル変数の乱用をしてはいけない、ということを学ぶようです。 私の場合、まだ毛根が生成され出したかもしれないが表層には何も変わりないくらいのレベルなのですが、 いくつかfunctionなどを独自で…

javascriptの配列入門(超初心者向け、個人的備忘)

javascriptでの配列について、また調べるのが面倒なので、こちらにまとめておきます。 配列の宣言 普通の配列 var array1 = ['値1', '値2', '値3']; 連想配列 var array2 = { key1:1, key2:2, key3:3 }; 文字などを入れる場合は、 var array3 = { usernam…

npm-scriptとAutoprefixerでvendor prefixの付与を自動化する

vendor-prefixをいちいちCan I useで調べて付与するのは当たり前のように面倒なので、npm scriptを使ってできないか調べて見て、できました。 postcssとAutoprefixerをインストール npm i -D postcss-cli autoprefixer -Dは、package.jsonファイルの「devDep…

初めてのnode-sassとnpm scriptでscssファイルをcssファイルにコンパイルする

前回、npmの初めの一歩を書きました。 tacosvilledge.hatenablog.com 今回は、node-sassとcpxを入れてnpm scriptを使えるようにしたいと思います。 サイトのデザインは、scssで書いた方が、cssで書くよりも効率よく書けるので、 scssで書いたものを、cssにコ…

npmって何? 基本的な使い方は?

npmとは? 参考:npm公式サイト docs.npmjs.com npmは、node package managerの略で、JavaScriptの開発者の問題解決や、コードのリユースに便利なツールである。昨今の開発現場では、数多くのパッケージ(モジュール)を使う。npmでは、数多くあるパッケー…

【JavaScript】 勉強のために電卓を作ってみた

「JavaScriptの初心者は電卓を作るとよい」と聞いて、作ってみました。 参考にしたサイトは、以下2つ。 Javascriptで電卓を作ってみた。ソース付き。 | ヤマヤタケシのブログ これは、フォーム(HTML上での表示)まで、javascriptですべて作っていて、結構高…

【JavaScript備忘】JavaScriptのSwitch文でcaseに条件式を入れたい

If else文を習ったら、大体の場合次は「switch」文ではないかと思います。 Switch文は、caseに値を設定し、その値に一致するかどうかで、実行することを変えるというときに使うのがデフォルトです。 こういうかんじ。 --------------------- var rank = 'C';…

【JavaScript】 headタグ内での宣言文

javascriptを使うときは、headタグ内に、以下を追記します。 <meta http-equiv="Content-Script-Type" content="text/javascript" /> そして、html内に、以下タグを追加し、なかにjavascriptを追記します。 <script type="text/javascript"> (ここにスクリプトを記述) </script> 外部読み込みする場合は、src属性を追加する。 <script type="text/javascript" src="xxx.js"></script> この際、タグ内に記述しても出力されない。</meta>…