Backbone.JSからAngular2まで、全9大JavaScriptフレームワークを書き比べた! - paiza times
(English article is here.) こんにちは、吉岡([twitter:@yoshiokatsuneo])です。 ウェブ開発に欠かせないJavaScriptフレームワークですが、日々発展しておりReact.js, Ractive.js, Aurelia.js, AngularJS2.0など次々と新しいフレームワークが出てきています。 一体どれを使えばいいのか？何が違うのか？何から調べていいのか迷うことがあります。 そこで、現時点で事実上全てとなる、９大主要フレームワークについて、実際に使ってみて比較を行います。 Backbone.js Ember.js Knockout.js AngularJS(1.x) React.js Ractive.js vue.js Aurelia.js AngularJS2.0(アルファ版) これらのフレームワークでは、以下のような機能が実現さ
入力欄に対応するラジオボタンやチェックボックスに自動でチェックを入れる方法 - JavaScript TIPSふぁくとりー
《2017年6月12日 10:00 AM 公開/更新》 入力欄に対応するラジオボタンやチェックボックスに自動でチェックを入れる方法 [入力フォーム] ウェブ上に掲載する入力フォームでは、ラジオボタンやチェックボックスに1対1で対応するテキスト入力欄が存在する場合があります。そのような場合は、テキスト入力欄に何か文字列が入力されただけで、対応するラジオボタンやチェックボックスに自動的にチェックが入るとクリック操作の手間が省けて便利です。そんな「入力欄に1対1で対応するラジオボタンやチェックボックスに自動でチェックを入れる」機能を作ってみました。 入力欄に対応するラジオボタンに自動でチェックを入れると便利 入力欄に対応するラジオボタンに自動でチェックを入れる方法 JavaScriptで入力文字数をチェックして対応ラジオボタンやチェックボックスをON/OFFするソース チェックボックスまたはラジ
プロ部登場 - マンガで分かる JavaScriptプログラミング講座
遊：あー 面倒くさい なぜ必修クラブなんて あるのよ 守：ねえ遊ちゃん どこにする？ 遊：守はどこ 希望なの？ 守：遊ちゃんが入る ところでいいよ 遊：そうね プロ部は手抜きが できると聞いたわ 守：プロ部？ 遊：とりあえず そこにしましょう きっと楽なクラブよ ナレ：必修クラブ の時間──（教室にいる3人） 麗：プロ部なんて わけの分からない クラブになるなんて… 遊：あれ 麗 どうしたの？ テニス部じゃないの？ 麗：ジャンケンに 負けたのよ 守：高美舎さん 実力はあるけど 運はないもんね 麗：くっ 屈辱だわ 先生：おっ 集まっているな 担当の桑立だ 遊：知っています 昼行灯と評判の 先生ですね 先生：お前なあ… 守：ねえ遊ちゃん まじめにしようよ 麗：つかぬことを伺います プロ部の『プロ』って 何ですか？ 先生：プログラムの 『プロ』だ 3人：プログラム！？ 先生：そうだ お前たち3人
Javascriptのブックマークレットに見る無名関数の使われ方 | 村式開墾日記
こんにちは。中川です。 最近Javascriptが流行っているようで、関連する記事やコードを見かける機会が増えました。 最近になって興味を持ち始めた方、急に仕事でやるハメになった方、結構多いのではないでしょうか。 Javascriptは書式こそC言語やJavaに似ていて馴染みやすいように見えますが、中身はかなり違ってます。 はじめてJavascript特有の書き方に触れたときに戸惑ったことがある方も多いと思います。 私が他人のコードを見ていて一番最初に「なんだこれは？」と思ったのは、あるブックマークレットのコードを見たときでした。 どんなコードだったかは忘れましたが、書式はこうでした。 javascript:(function(){/* statements */})(); ...[1] 最後の()はなんだろうか？ 関数は function f(x){/* statements
Chrome Experiments
Chrome Experiments is a showcase of work by coders who are pushing the boundaries of web technology, creating beautiful, unique web experiences. You'll find helpful links throughout the site for creating your own experiments, and you can also explore resources like WebGL Globe and our workshop of tools.
isNaN/JavaScriptリファレンス
JavaScript Reference isNaN 関連オブジェクト : - タイプ : ビルトイン関数 書式 isNaN(数値、あるいは文字列) サンプル check = isNaN("banban"); document.write("この値は" + check + "です"); 指定した値が数値かどうかを調べます。値が数値ならば false、数値でない場合は true を返します。 結果 Top / Home / Index / Next
<input type="text">でEnterを押してもsubmitさせない方法【HTML, JavaScript】 - Programming Magic
<input type="text">でEnterを押すとsubmitされてしまうことがある。 これは便利なときもあるが、場合によっては不便になる。 Enterを押すとsubmitされるのは以下の3パターンがある。 1. Opera、Safariで、<input type="text">または<input type="password">がある場合 <form> <input type = "text" name = "text1"> <input type = "text" name = "text2"> </form> 2. IE、Firefoxで、<input type="text">または<input type="password">が１つ以上と、<input type="submit">または<input type="image">が１つ以上ある場合 <form> <input
[JavaScript]FirefoxのonKeypressの処理について : 構想雑文
構想雑文 WEBデザインとmacに関すること中心の自分向けメモ主体のブログ。 DREAMWEAVER、Illustrator、Photoshopなどのアプリケーションの設定や使い方。HTML、CSS、JavaScript、PHPのコーディングのことをあれこれ書いています。 JavaScriptを使い、例えば、簡単なタイピングゲームを作ろうとすると、onKeydownやonKeyPressなどと一緒に、どのキーを入力したのかを調べるために、event.keyCodeを使うことになります。 ここで困るのが、以下の点でしょうか？ event.keyCodeで取得できるキーコードの数値がonKeydown(onKeyUp)とonKeyPressで異なることFirefoxとIEでonKeyPressの処理が異なること event.keyCodeで取得できるキーコードの数値がonKeydown(onK
![[JavaScript]FirefoxのonKeypressの処理について : 構想雑文](https://cdn-ak-scissors.b.st-hatena.com/image/square/da78a05937633f7a2b4b2219826151c370cd607b/height=288;version=1;width=512/https%3A%2F%2Fparts.blog.livedoor.jp%2Fimg%2Fusr%2Fcmn%2Fogp_image%2Flivedoor.png)
Javascriptメモ
になる可能性もあります。可変だからです。 <form name="myform"> <table> <tbody> <tr><td><input type="checkbox" name="check0">あいうえお</td></tr> <tr><td><input type="checkbox" name="check1">かきくけこ</td></tr> </tbody> </table> </form> チェックされている個数を調べるのに function checkCnt(){ var count = 0; var obj = document.myform; var len = obj.elements.length; for(var i = 0; i < len; i++){ if(obj.elements["check" + i].checked){ count++; } }
JavaScript/select選択ボックスを動的に作る - 吉野情報技研(jack'slab)
select選択ボックスを動的に作る † JavaScriptで、こんな感じの、選択肢が動的に変わる選択ボックス作るサンプルです。 最初に選んだ選択ボックスによって、次の選択ボックスの選択肢が変わります。 解説 フォームの<select>+<option>タグで作った選択ボックスは、 Selectオブジェクトという種類のオブジェクトになります。 Selectオブジェクトは、optionsという選択肢の配列を持っています。 これにアクセスすることで、動的に選択肢の内容を変えることができます。 selectオブジェクト(選択ボックス)を取得するには、 タグで<select name="選択ボックス名" 〜で名前をちゃんとつけて、 form name="フォーム名" で名前をちゃんとつけて、 フォーム名.elements["選択ボックス名"] または フォーム名.選択ボックス名 で
オブジェクトリファレンス/JavaScriptリファレンス
JavaScriptで用いられるオブジェクトは、下記の図にあるように、windowオブジェクトを頂点としたツリー構造で定義されています。この章では、それぞれのオブジェクトが持つプロパティとメソッドについてオブジェクト別に解説します。
クロスブラウザで動作可能なカレンダーウィジェット「Cross browser javascript calendar」:phpspot開発日誌
クロスブラウザで動作可能なカレンダーウィジェット「Cross browser javascript calendar」 2006年10月30日- Cross browser javascript calendar クロスブラウザで動作可能なカレンダーウィジェット「Cross browser javascript calendar」。 dhtmlgoodiesにてまたまた便利なライブラリを発見 設置方法も非常にシンプル。 JavaScript/CSSを読み込み inputタグのonclickイベントでdisplayCalendarメソッド呼び出し ソースは次のようにとてもシンプルに実装できます。 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <
JavaScript オブジェクト名の取得
CSSやHTML、そしてJavaScriptについてリファレンス的に扱ってみたいと思います。もちろん実践的なものも。
第2回 ブラウザからHTMLはどう見えているかを理解しよう ～ドキュメントツリー～
DOMではHTMLを自由に操れることを紹介してきましたが，ここでは，その仕組みを学んでいきましょう。 ブラウザはHTMLを読み込むと，内部的にドキュメントツリーを構成します。次のHTMLを例に具体的なドキュメントツリーを見てみましょう。 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <meta http-equiv="Content-Language" content="ja"> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>ドキュメントツリー</title> </head> <body> <h1>ドキュメントツリー</h1> <p>HTMLの要素の構造を表します。</p> </
電話占いはどうなの？メリット・デメリットを解説！ - 電話占いどうなの？当たる占い師と出会う方法を徹底解説
電話占いはどうなの？と思っていて利用をためらっている人もたくさんいます。 この記事では電話占いのメリット・デメリットをまとめました。 電話占いを選んで後悔しないために重要な注意ポイントも解説します。 電話占いと対面占いを比較してどちらが良いか迷っていた人もきっと選べるようになるので、詳細をぜひ確認してみてください。 電話占いのメリット 1 住まいに関係なく人気占い師の鑑定を受けられる 2 24時間いつでも占いを楽しめる 3 たくさんの占い師から好きな人を選べる 4 誰にもバレずに占いができる 引用元：電話占いサイトおすすめ 電話占いのメリットとは？ 電話占いはどうなのと考えたときにまずはメリットを知りたいと思うのではないでしょうか。 占ってもらうときには対面占いやメール占いなども利用することができます。 ここでは電話占いを選ぶメリットを詳しく解説します。 いつでもどこでも気軽に利用できる
[javascript] urlとtitleタグの中身を取得する方法 - html css, javascript
title： url： <script type="text/javascript"> function cli(){ hoge01 = document.title; hoge02 = document.URL; document.getElementById("bar01").innerHTML = hoge01; document.getElementById("bar02").innerHTML = hoge02; } </script> <input type="button" value="実行1" onClick="cli()" style="margin:0 0 10px 1px;"> <pre> <p>title：<span id="bar01"></span></p><p>url：<span id="bar02"></span></p> ↓こちらの本の315ページに、l
特定の要素の中身をごっそり書き換える方法 - JavaScript TIPSふぁくとりー
《2017年6月8日 5:00 PM 公開/更新》 特定の要素の中身をごっそり書き換える方法 [装飾・内容変更] JavaScriptを使って特定のHTML要素の内容をごっそり丸ごと違う内容に書き換えるには、innerHTMLプロパティの値を書き換えるだけです。とても簡単に要素の中身を丸ごと異なる内容に変化させられます。JavaScriptで生成した何らかのデータを動的にウェブ上に表示する際によく使います。 特定の要素の中身をごっそり丸ごと書き換える方法 特定の要素の中身を丸ごと全部書き換えるJavaScriptの書き方 特定の要素の中身を丸ごと全部書き換えるJavaScriptの例 特定の要素の中身をごっそり丸ごと書き換える方法 JavaScriptを使うと、特定のHTML要素の中身をごっそりまるごと動的に書き換えることができます。装飾を変更するレベルではなく、表示されている内容を何もか
オブジェクトの表示非表示を制御する｜JavaScript Tips
<form><input type="button" value="表示切替" onClick="checkExpand('text');"></form> <span id="text">あいうえお</span> <script language="JavaScript" type="text/JavaScript"> <!-- /**************************************************************** * 機 能： オブジェクトの表示非表示を制御する 1 * （表示している場合は非表示、非表示の場合は表示） * 引 数： ch 表示/非表示を切り替えるオブジェクト名 * 戻り値： なし ****************************************************************/ functio
JAVAscriptコレクション・文章を折りたたんだり表示したり
ホーム ＞HTMLに役立つヒント＞ JAVAスクリプトコレクション ＞ 文章を折りたたんだり表示したり 文章を折りたたんだり表示したり 「しらぎく折り畳みスクリプト」に刺激され、もっとシンプルな折りたたみ方式を考えてみようと、やってみた。 考え方は単純だ。文章の表示/非表示はCSSのdisplay指定で行う。JAVAscriptでこの指定の値を「none/block」に切り替えることで文章を見えるようにしたり折りたたんだりする。 基本はこれだけ。では作ってみる。 CSSを使って見えたり見えなかったりする部分を、あらかじめ「display:none;」として見えなくしておく。ここにはIDも仕込んでおく。IDはユニークなもの（他に同じものがないという意味）であればなんでもいいが、ここでは「SH-001」とした。 <div id="SH-001" style="display: none"> こ
【HTML】スタイルシート？？ <div style=”display:none”>なんたらかんたら</div> このタグって どんな時使いますか？
【HTML】スタイルシート？？ <div style=”display:none”>なんたらかんたら</div> このタグって どんな時使いますか？
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
