JavaScript の parseInt で小数を整数に変換しようとしてはまるYou signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session. Dismiss alert
【JavaScript】条件式で0とnull/undefinedの判定を分ける - Qiita
JavaScriptでは0もnull、undefinedもすべて同じ判定になるけど分ける方法ないの？ タイトルの通り、こんな場合どうするか。if (!value)と書いてしまうと、0、null、undefinedの全部がtrueとして判定されてしまう。 null、undefinedだけtrue判定にしたいケースがあったので調べてみた。 [JavaScript] null とか undefined とか 0 とか 空文字('') とか false とかの判定についてに大体書いてあるが、このトピックの部分だけまとめてみた。 TL;DR if (value == null)を使うのが一番スマートな書き方のようです。 1. if (value === undefined || value === null) 愚直に値をundefinedとnullと比較する方法。 誰が見ても分かりやすいが、どこか野
innerHTML より insertAdjacentHTML を使う - Qiita
はじめに とある要素の中をいじりたいという時 innerHTML で操作することもあるかもしれません。 しかし、実はこれはあまりよろしくない。 innerHTML は既存の要素を破壊（？）する innerHTML を書き換えるということはつまり、要素の中身をすべて新しいものに書き換えるということです。 既存の要素は、新たな要素として扱われてしまいます。 サンプル 例えば、以下のようなHTMLとJavaScriptコードがあったとします。
小数計算の誤差 0.1 + 0.2 が 0.30000000000000004 になる理由
です。（10進数の「整数」はすべて2進数に正しく変換できます） JavaScript に限らずコンピューターで計算をする場合は、10進数から2進数に変換してから計算して、計算結果をまた2進数から10進数に戻して表示してくれています。 例えば 2 + 3 は、コンピューターでは次のように計算されています。（10進数、2進数の変換方法はこのあと説明しますので、なんとなくそういうものだとご理解ください） コンピューターも10進数で計算すれば良さそうですが、コンピューターは「ON（1）」と「OFF（0）」を表すスイッチのかたまりのような物で作られているため、「1」と「0」のみの2進数で計算したほうが都合がいいのです。 10進数の小数が2進数に正しく変換できない理由 なぜ10進数の「小数」が2進数に正しく変換できないのでしょうか？ それではまず10進数から2進数への変換方法を確認してみましょう。 1
サイトが重いときに！画像をふわっと遅延表示させる「lazysizes.js」【レスポンシブ対応】【PageSpeed Insights改善】 – 東京のホームページ制作 / WEB制作会社 BRISK
ホームページ制作 BLOG サイトが重いときに！画像をふわっと遅延表示させる「lazysizes.js」【レスポンシブ対応】【PageSpeed Insights改善】 サイトが重いときに！画像をふわっと遅延表示させる「lazysizes.js」【レスポンシブ対応】【PageSpeed Insights改善】 更新日：2019/08/07 Webサイトの表示速度を上げられるよう、スクロールをしたタイミングで画像を読み込む「画像の遅延表示」ができるJavaScriptはいくつかあると思います。私も試したことはありますが、画像がパッと出てきて画面がガタついたり、jQueryをいじらないとカスタムしにくかったりと、思った通りの動きをせず悩んでいました。 そんななか見つけた「lazysizes.js」は、「JavaScriptの読み込み」と「クラスの追加」だけで遅延表示ができ、簡単なcssの追記で
【JavaScript】JavaScriptの正規表現で変数を使う - だめだま
JavaScriptで正規表現のmatchを使う場合 通常 hoge.match(/abc/); とするけどabcの部分は変数ではなくてStringとして認識されてしまうので var abc = "efg"; hoge.match(/abc/); としてもefgを検索してくれない。 そこで、変数を入れたい場合は正規表現オブジェクトを使う var abc = "efg"; reg = new RegExp(abc); hoge.match(reg); とするとefgで検索してくれるようになる。 細かい検索条件も設定可能 reg = new RegExp("^" + abc + "[0-9]+$");
画像（IMG要素）の読み込み後（loadイベント）の処理が動かない対策 ‹ JavaScript ‹ emwaiblog
emwaiblog › JavaScript › jQuery › 画像（IMG要素）の読み込み後（loadイベント）の処理が動かない対策 アフィリエイト広告を利用しています。 JavaScript › 画像（IMG要素）の読み込み後（loadイベント）の処理が動かない対策 jQueryを使って、画像（IMG要素）にイベントリスナーを設置したら動かなかったので対策したメモです。今まで気づかなかったのなんでかなぁ、とちょっと不思議でしたが単に物忘れだと思うので備忘録として書きます。 一定の間隔で複数の画像をスライドさせるようなコードをチャチャッと書いてみたものの、各画像が大きそうだったので「次の画像を表示前に読み込み開始させるか」と思ってIMGタグのロードイベントを取ろうと思ったら、Safariではうまく動いていたのにChromeやFirefoxではうまく動きませんでした。 $('<img
videoタグの使い方とJavaScriptでオリジナルコントローラーを自作する方法
2020年01月15日 ／ 2018年2月22日 HTML5から新たに追加されたvideoタグを使う事で、HTMLに動画を埋め込むのがとても簡単になりました。そこで今回はvideoタグの使い方と、JavaScriptで簡単に動画を制御して、オリジナルコントローラーを作る方法を解説したいと思います。 また、videoタグを使うにあたって、Androidにおけるの注意点も記載しています！ videoタグのHTML5への記述の仕方 HTML5への記述の仕方はとてもシンプルです。動画を指定する方法として大きく2種類あります。最もシンプルな記述としては、以下のようにvideoタグとsrcによる動画を指定するだけです。（※ただしこのままでは再生しません。） <video src="sample.mp4"></video> もうひとつは幅広い種類のブラウザ環境で再生できるようにする為、以下のように複数の
ChromeのデベロッパーツールでJSをデバッグする方法(2022年版) - ICS MEDIA
JavaScriptのデバッグは、ウェブ開発の必須スキルのひとつです。プログラムの実行をデバッグすることで、現在の変数の値や、処理がどのように進んでいるのかを確認できます。デバッグによってプログラムが意図した動作になっているかの分析に役立てられます。 本記事ではGoogle Chromeブラウザーの「Chrome Developer Tools」（以下「デベロッパーツール」、「DevToolsデブ・ツールズ」という略称もあります）を使用してJavaScriptをデバッグする際の基本的な使い方を解説します。「今までデベロッパーツールを使ったことのない」という方でもこの記事を読めば理解できるよう、チュートリアル形式になっています。20分ほどで理解できるようまとめているので、順番に試しながら読み進めてください。 この記事で学べること デベロッパーツールの使い方 JavaScriptのブレークポイ
JS：配列の正しいソート方法 | ARTICLE | goma
配列のソートで困ったことはありませんか？実際たまにしか使わないので、自分の備忘録を見返しています。 ということで、少し説明を加えて備忘録をシェアします。 説明はいらないから、必要なことだけ知りたい方は目次からご希望の箇所に飛んでください。 .sort()の基本まず、.sort()の構文は以下になります。 arr.sort([compareFunction]) 引数compareFunctionには、ソート順を定義する関数を指定します。省略された場合、配列は各要素の文字列比較に基づき辞書順にソートされます。Array.prototype.sort() - JavaScript | MDN ここで言う「各要素の文字列比較に基づき辞書順にソート」ですが、文字列をUnicodeへ変換した時の数値です。 引数を持たせない場合の.sort()では単純に文字をUnicodeに変換した値でソートしてしまう
レスポンシブサイトでクリッカブルマップを使う時に超便利な「jQuery RWD Image Maps」
業務メモ。 最近はかなり減りましたが、Webサイト作成時たまに使用せざるを得ないあいつ。そう、クリッカブルマップ。 画像の好きな場所にリンクを仕込めるのは便利ですが、レスポンシブの案件ですとリンクエリアが指定した座標からずれてしまうため困っちゃう。 jQuery RWD Image Mapsはそんな悩みを一発で解決してくれる便利なjQueryプラグインです。 使い方 使い方は非常に簡単。まずはstowball/jQuery-rwdImageMapsからjsファイルをDL。適宜アップロードします。 HTML [html] <script type="text/javascript" src="jquery-1.11.0.min.js"></script> <script type="text/javascript" src="jquery.rwdImageMaps.js"></script>
スマホのボタンタップUIをCSSとJavaScriptを使って良い感じにしてみる | TENPURA - 1→10design Lab -
スマートフォンのボタンのタップUIは、 iPhoneとAndroidではデフォルトのUIが異なります。 iPhoneでは黒く透過し、Androidでは黄色い枠がつきます。 VIEW DEMO ※ スマホで見て下さい。 iPhoneではデザインに余り影響が出ないのでいいですが、Androidは濃い色がついてしまうので、黄色を使っていないサイトのデザインでしたら、どう見ても不自然に目立ってしまします。 大半のスマートフォンサイトはこういったUIのままリリースされているのが現状です。 そういったデフォルトのタップUIを消すには下記のCSSを記述すれば消えます。 body { -webkit-tap-highlight-color: rgba(0, 0, 0, 0); -moz-tap-highlight-color: rgba(0, 0, 0, 0); tap-highlight-color:
JavaScriptの関数とメソッド
はじめに JavaScriptはオブジェクト指向言語です。しかし利便性のために、C言語などと同じようにグローバルな関数を定義し、構造化的な手法でプログラミングすることも可能です。 この記事では、JavaScriptにおける関数の基本的な性質を見ていくと共に、関数の正体、および関数の使用方法について解説していきたいと思います。 なお、この記事はJavaScriptの解説ですが、その内容は、標準仕様のECMAScriptで扱われる範囲に基づいています。従って、同じくECMAScriptを元にしている言語（JScript、ActionScript）でも通じる内容になっています。 対象読者 プログラミングの基本的な知識、ならびにオブジェクトやメソッドと言った基礎的な概念については、ここでは解説しません。最低限、オブジェクト指向プログラミングについて理解をしている人を対象としています。 この記事は、
コーディングを楽にするためのPHP関数と、Macか判別する関数
このブログをリニューアルするにあたって、コーディングを楽にするためにブラウザごとにCSSのclassを分けるPHP関数と、Macか判別する関数が必要になったので書きました。 よろしければご活用ください。 ブラウザごとにclassを分けるPHP関数 皆さん、特定のブラウザだけ微妙にズレが生じるときって、どうやって対応されてますか？ 私はCSSのハックは使いたくないので、普段はIEの条件分岐コメントで対応していました。 先日、このブログをHTML5でリニューアルするときに HTML5ロゴのページ のソースを参考にしたのですが、DOCTYPE宣言の直下にこういうふうに書かれていました。 HTML なるほど、IE6だと ie6 と ielt8 が、IE7だと ie7 と ielt8 が、IE8だと ie8 と ielt8 が追加されるので、例えばIE6だけwidthがおかしい場合は CSS /*
javascriptでforeachと同等のことをする « kawama.jp
「for+in」を使うとできます。なかなか便利。 var hairetsu = [1,2,3,4,5,6]; for (var i in hairetsu){ alert(i); } こんな感じになります。 prototype.jsのeach関数などを使っても同様のことが実現できるようです。 2 Comments » for inは使わないほうが良いです http://d.hatena.ne.jp/amachang/20070202/1170386546 コメント by mayokara — 2008年1月3日 @ 02:01 mayokaraさん、ご指摘ありがとうございました！ コメント by kawama.jp — 2008年1月6日 @ 11:08 RSS feed for comments on this post. TrackBack URL Leave a comment 名前
単語前方一致・単語後方一致・単語完全一致 String.indexOfの魔力 - ぶれすとつーる
indexOfにはあまり知られてない裏技的な使い方がある。 よく知られてるString.indexOf indexOf 構文 indexOf(searchValue[, fromIndex]) パラメータ searchValue 検索する値を表す文字列。 fromIndex 呼び出す文字列内の検索を始めるための位置。0 とその文字列の長さの間にある整数を指定できます。デフォルトの値は 0 です。 概要 呼び出す String オブジェクト 中で、指定された値が最初に現れたインデックスを返します。fromIndex から検索を始め、値が見つけられない場合、-1 を返します。 indexOf - MDC Doc Center 概要からわかるように、文字列の出現インデックスを取るものだが、肝心なのは見つからない場合-1を返すことだ。 これを利用してとある条件の下で以下の三つの正規表現ライクなこと
非公開サイト
サイトの構築。作品の販売。ブログの投稿。この他にもさまざまな機能があります。 ログイン サイトをはじめよう 非公開サイト このサイトは現在プライベート設定になっています。
[JavaScript]addEventListenerを手軽に使おう / LiosK-free Blog
2007-12-05 カテゴリ: Client Side タグ: JavaScript JavaScriptのイベント処理は面倒くさい。 ブラウザごとにaddEventListenerとattachEventを使い分けたり、eventオブジェクトを引数として受け取るかwindow.eventとして受け取るかを考えたり、thisの扱いについて考えたりしなくてはいけないからだ。 ということで、すごく苦手意識を持っていたのだが、↓の関数を書いておくだけでほとんどのケースには対応できるってことに気づいた。 function observe(target, type, listener) { if (target.addEventListener) target.addEventListener(type, listener, false); else target.attachEvent('on'
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
http://www.crystal-creation.com/web-appli/technical-information/programming/javascript/sample/get.htm
配列（Array） - とほほのWWW入門