投稿

6月, 2018の投稿を表示しています

jQueryで要素の存在を確認する5つの方法

イメージ
jQuery で HTML 要素 があるかないかを 判定 する場合、様々な方法があり選ぶ理由も人それぞれで、どれを使ったらいいのか迷っている方のために、 書き方 や 処理速度 ( パフォーマンス )を比較している サイト をまとめましたので、選定する基準として参考になればと思います。 要素の存在を確認する 要素 の 存在 を調べるには、以下の 5つ の 書き方 があります。 5つの書き方 [0] と get(0) 、 size() と length はほぼ一緒です。 ($("selector")[0]) ? true : false; ($("selector").get(0)) ? true : false; ($("selector").size()) ? true : false; ($("selector").length) ? true : false; ($("selector").is()) ? true : false; 処理速度(パフォーマンス) Firefox の Firebug という プラグイン を使って計測した結果が紹介されてます。 コード 速度 document.getElementById("id") != null 0.019ms $("selector")[0] 0.033ms $("selector").get(0) 0.040ms $("selector").size() 0.041ms $("selector").length 0.069ms $("selector").is("*") 0.169ms 引用: [JS][jQuery] 要素の存在を確認する6通りのコードと実行速度 | きほんのき 結果、どれを選ぶべきか? ぶっちゃけ、 どれでも良い です。 著者の場合は速度重視なので、 $("selector")[0] を使います。 もちろん、 ピュア...

不安定なWordPressのoEmbedをPz-LinkCardプラグインにしたら幸せに!

wget+FTPでレンタルサーバーのファイルを取得する方法

イメージ
以前、 レンタルサーバー で データベース や ファイル を 自動 で バックアップ する方法を紹介しました。 しかし、 バックアップ したデータは レンタルサーバー 内に保存されたままで、もし、 サーバー 自体にトラブルが発生した場合は、せっかく バックアップ したデータを取り出すことができなくなります。 そこで今回は、 レンタルサーバー 内にあるファイルを wget コマンドと FTP で 自宅サーバー へ ダウンロード する方法をご紹介します。 テクノロジーの力で実りある人生を! Minory - Minory FTPのユーザーとパスワード付きwget FTP 認証で使用する ユーザー名 と パスワード を指定して ダウンロード する方法は以下の通りです。 wget ftp://[ファイルパス] --user=[ユーザー名] --passwd=[パスワード] 下記は、当サイトでお馴染みの エックスサーバー のルートディレクトリ直下にある、 backup フォルダ内の dump_[今日の日付].sql をダウンロードする場合の例です。 wget +%y%m%d).sql --user=XXXX@XXXX.XXX --password=XXXXXXXX ついでに、保存先をマウントしたNASに指定するとこんな感じです。 wget +%y%m%d).sql --user=XXXX@XXXX.XXX --password=XXXXXXXX -P /mnt/nas/backup URLに認証情報を付ける FTP の URL に ユーザー と パスワード を付ける方法もあります。 どちらも動きは同じです。 wget ftp://[ユーザー名]:[パスワード]@[ファイルパス] ただ、この方法を使う場合には 注意 が必要です。 それは、 ユーザー名 や パスワード も URLエンコード しなければならないということ。 特に エックスサーバー のように ユーザー名 に「 @(アットマーク) 」があると失敗してしまいます。 URLエンコード してくれるサイトなどを利用して wget しましょう。 UrlEncode.netはURLエンコードしたい文字列をエンコードし、デコードしたい文字列を...

非推奨になったAjaxの同期通信によるブラウザの警告を対策する

イメージ
Ajax の 同期通信 について、かなり前から 非推奨 になっていることは皆さんご存知だと思いますが、最近古い コード を発見するまで忘れていた、と言うより意識していなかったので、この機会に過去へ振り返って概要と 対策 を記事にし思います。 同期・非同期とは? 詳しく説明するほど理解していないので、 プログラマー 目線で簡単に紹介したいと思います。 処理が完了するまで待つか待たないか 非同期通信 例えば、処理の 実行 タイミング を連続して コンソール に出力する以下のような処理があるとします。 $(function(){ console.log("1. 処理開始"); $.ajax({ url: "/path/to/api", type: "get", dataType: "json", success: function(response) { console.log("2. Ajax処理終了"); } }); console.log("3. 処理終了"); }); プログラム は基本的に 上から下 に流れるので、 1、2、3 の 順番 に表示されるはずですが、 非同期通信 の場合は、 Ajax で実行した結果が返ってくる前に次に処理に進みますので、結果はこのようになります。 > 1. 処理開始 > 3. 処理終了 > 2. Ajax処理終了 同期通信 ところが 同期通信 の場合は、 Ajax の処理が完了して結果が返ってくるまで待ちます。 前述のように警告が表示されますが、 async: false を使って同期通信にすることができます。 $(function(){ console.log("1. 処理開始"); $.ajax({ url: "/path/to/api", type: "get", dataType: "json", async: false, success: functio...

URLだけでスクリーンショットを自動生成する3つのAPI

カメラで「クレジットカードを読み取る」に対応した入力フォーム(iOS 8以降)