jQuery Mobileでのアプリケーション開発にBackbone.jsを導入しよう | Lab by engineering@dwango.jp
こんにちは、2011年度新卒エンジニアの夏目です！突然ですがみなさんJavaScript書いてますか？ 最近はjQuery Mobileなどを利用したスマートフォン向けアプリ開発において、クライアントサイドでもヘビーなJavaScriptのコーディングをする機会があると思います。そのようなときコードのいたるところにHTMLが混入したり、どこでどのデータを扱っているのか分からなくなるということになりがちです。 今回はそんな悪夢のようなコーディング生活に一筋の希望の光を照らすBackbone.jsを紹介したいと思います。 対象読者 JavaScriptでの開発経験がある方 Backbone.jsとは Backbone.jsはDocumentCloudが開発をしている、クライアントサイドのJavaScriptコードをModel、View、Controllerで構築するためのフレームワークです。b
サーバサイドJavaScriptの本命「node.js」の基礎知識
本稿では、Node.jsの特徴や動作原理に触れ、サンプルや役に立つパッケージ、活用事例などを紹介したいと思います。 主なサーバサイドJavaScript Node.jsに触れる前に、予備知識として他のサーバサイドJavaScriptにも触れておきます。Node.js含め、サーバサイドJavaScriptには、主に以下のようなプロジェクトがあります。 サーバサイドJavaScripの標準仕様「CommonJS」とは サーバサイドJavaScriptには、「CommonJS」と呼ばれる標準化が策定されています。標準化というと難しい感じがしますが、要はサーバサイドでJavaScriptを実行するのに何が必要かを仕様として、定義しているドキュメントのことです（例えば、「ログが必要だよね」など）。 Node.jsは、このCommonJSに則って開発されています。現段階であれば、CommonJSの仕様
JavaScriptMVC
You can use JavaScriptMVC as a complete framework, or download only the parts you need. Read JavaScriptMVC's features for more info. The Plan. Download JavaScriptMVC Read the Getting Started Guide Read the tutorials Browse the examples What People are Saying "JavaScriptMVC is the single most important reason why I don't hate client side development anymore." Mihael Konjevic, HibreedCMS "JavaScript
【インフォシーク】Infoseek ： 楽天が運営するポータルサイト
日頃より楽天のサービスをご利用いただきましてありがとうございます。 サービスをご利用いただいておりますところ大変申し訳ございませんが、現在、緊急メンテナンスを行わせていただいております。 お客様には、緊急のメンテナンスにより、ご迷惑をおかけしており、誠に申し訳ございません。 メンテナンスが終了次第、サービスを復旧いたしますので、 今しばらくお待ちいただけますよう、お願い申し上げます。
2/5 閲覧者がスタイルシートを切り替えられる機能を作る [ホームページ作成] All About
閲覧者がスタイルシートを切り替えられる機能を作る(2ページ目)複数のCSS(スタイルシート)ファイルを用意しておき、閲覧者がプルダウンメニューを使って自由にスタイルを切り替えられる機能を作ってみましょう。読み込むCSSファイルそのものを変更できるので、装飾やレイアウトを大きく変えられます。好みのデザインを選択できるようにしたり、様々な配色で表示がどう変わるかを確認できるようにしたい場面などで便利です。 切り替え対象のスタイルシートの読み込み準備 CSS(スタイルシート)ファイルは、HTMLソース内にlink要素を使って記述することで読み込めます。たとえば、以下のような感じで記述します。 <link rel="stylesheet" type="text/css" href="style.css"> 上記では、href属性の値に指定した「style.css」というCSSファイルを読み込んでい
![2/5 閲覧者がスタイルシートを切り替えられる機能を作る [ホームページ作成] All About](https://cdn-ak-scissors.b.st-hatena.com/image/square/5164e4f8fe6378ebefce31b42195a75c62b9a359/height=288;version=1;width=512/https%3A%2F%2Fimgcp.aacdn.jp%2Fimg-a%2F1200%2F900%2Faa%2Fgm%2Farticle%2F2%2F3%2F9%2F3%2F0%2Ftopimg_original.png)
インラインフレームから親ウィンドウの操作
オブジェクトについて理解する必要があるのでは？ あとは自然につながってくると思いますが。 とりあえずイメージは挿入ではなく変更にして かきなおしました。 image1.jpgとimage2.jpgを入れ替えます。 いかがでしょう？ //iframe.htm テキストの制御：<span id="text1">データ</span><br> 画像の制御：<image id="image1" src="image1.jpg"><br> <hr> <iframe SRC="src.htm" name="iframe1"></iframe> //src.htm <a href="javascript:void()" onMouseOVer="tagTxt=parent.document.getElementById('text1');tmpTxt=tagTxt.innerHTML;tagTxt.inn
インラインフレームのリンク設定-JavaScript入門
HOME JavaScript入門 インラインフレームのリンク設定 インラインフレームに表示するサイトURLを変更する方法について見ていきましょう。 JavaScriptを用いると、 インラインフレーム内のURLを自由に変更できます。 ただし他人のサイトを表示するのはご法度なので、 あくまで自分のサイト内のページに留めておきましょう。 インラインフレームのリンク変更のサンプル HTMLに、以下のように記入してみましょう。 <a href="JavaScript:ifr('https://pazru.net/puzzle/')">パズルの部屋へ</a> <br> <iframe src="https://pazru.net/" name="waku"></iframe> <script> function ifr(jpURL){ waku.location = jpURL; } </scri
【jQuery】外部ファイルの読み込みと操作 - MAXIMUM.PROの日記
今回は、外部ファイルの読み込みと操作、GETメソッドを使ったファイルの扱い方を中心に紹介していきます。APIを使ったWebアプリケーションをつくる際に必要になってくるJSON形式について覚えましょう！！ 以下のファイルを用意してください。 sample.html <h2>load</h2> <p>外部ファイルのテキストデータをそのままタグに置き換える</p> <!-- javascript:void(0)：リンク表示、アクションは起こさない --> <div><a id="load" href="javascript:void(0)">読み込み</a></div> <div id="txtLoad">データ</div> <br /> <p>外部ファイルのHTMLデータをそのままタグに置き換える</p> <a id="load2" href="javascript:void(0)">読み込み
『[jQuery] 外部JavaScriptファイル読込みに関する考察』
前回の「GO2WEB20のTwitterバッチをAmebloにつけてみた。と、IE対策方法 」に端を発してjQueryを使って外部のJavaScriptのソースを読み込む際の様々なやり方の検証をしてみる。 jQueryのappend()を使ってタグを追加できますのでこれでscriptタグを追加してみます。 <script> $(document).ready(function(){ var script_tag = document.createElement("script"); script_tag.type = "text/javascript"; script_tag.src = "hoge.js"; script_tag.charset = "utf-8"; $("body").append(script_tag); }) </script> function foo() { a
![『[jQuery] 外部JavaScriptファイル読込みに関する考察』](https://cdn-ak-scissors.b.st-hatena.com/image/square/fa24a3b30d8fa23a05574c6d7eda22c94d409206/height=288;version=1;width=512/https%3A%2F%2Fstat.ameba.jp%2Fuser_images%2F20100402%2F00%2Fitboy%2F60%2F00%2Fj%2Fo0687039310477745699.jpg)
jQuery.jsを使ってhtmlを外部読み込み
htmlの作成時に各ファイルで共通している部分がありますね。 ・ヘッダとか ・フッタとか ・グローバルナビとか そんな時、どうしてますか？ 1.各ファイルに同じ記述をしてますか？（変更掛かったらめんどくさいですね） 2.SSI（サーバーサイドインクルード）してますか？（できればいいけどちょっぴり敷居が高い？） 3.avascriptでdocument.writeつかってますか？（ソースが長いとめんどくさいですね） ざっくりリストアップすると以上のような方法が考えられます。 僕も上記のどれかをケースバイケースで使ってました。 そこにもうひとつ選択肢を追加します。 jQuery.jsを使って外部のhtmlファイルをまるごとインクルードしちゃいましょう。 方法 1.何はともあれjQuery.jsをダウンロード http://jquery.com/ 2.htmlのheader要素内で読み込む <s
JavaScriptで他のファイルのhtmlソースを読み込むには？
一番簡単な方法はprototype.jsやjQueryなどのAjaxライブラリを使用することでしょう。 以下にprototype.js(http://www.prototypejs.org/)を使用して別のHTMLソースを読み込んで表示する手順を示しておきます。 1) まず読み込まれる側のHTMLファイルを準備します(ここではload.html)とします。 2) 次に読み込む側のHTMLの、読み込んだファイルの内容を表示されたい箇所に<div id="container"></div>と記述しておきます。 ※) ID属性値は任意のもので結構です。 3) 読み込み側のHTMLのJavaScriptに以下のように記述します。 <script type="text/javascript" src="[prototype.jsファイルを指定]"></script> <script type="te
Ajax : サーバー上のHTMLデータを読み込みページ内に表示する
■Ajax : サーバー上のHTMLデータを読み込みページ内に表示する サーバー上にあるHTMLデータを読み込みページ内に表示するサンプルです。これはサーバー側にCGIプログラムなどを必要としない最もシンプルなものと言えます。 まず、最初にサーバーと通信するためのXMLHttpオブジェクトを作成します。ここでは動作させるブラウザを Windows版、Internet Explorer 6、Firefox、Netscape 6以降、Opera 8 Macintosh版、Safari、Firefox、Netscape 6以降 としています。Windows版のInternet Explorer 6とそれ以外ではオブジェクトが異なるためサンプルの緑色の部分のようにtry...catchを使ってオブジェクトが利用できない場合にnullを返すようにしています。 次にHTMLデータをサーバーから取得しま
Titanium - JavaScript で iPhone/Android アプリを作る - naoyaのはてなダイアリー
Titanium Mobile は JavaScript で iPhone/Android のアプリ (not Webアプリ) を開発できる開発環境。詳しくは Titaniumで始めるモバイルアプリ作成の基礎知識 (1/3)：Web技術でネイティブアプリを作れるTitanium（2） - ＠IT などに解説があります。 少し時間があったので、JavaScript で作るというのがどんな感じか試してみました。作ったアプリは こんな感じで TableView があり、選択すると WebView でアプリ内ブラウザが立ち上がる、ブラウザはツールバーで「戻る」や「リロード」が可能。あとはタブコントロールがあったり･･･という単純なもの。初期起動画面のサイトリストは、HTTP でローカルに立てたサーバーから JSON で読み込んでいます。 Web上のドキュメントを見ながら2, 3時間試行錯誤で一応の
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
IDEA * IDEA
iframe 内の javascriptのfunctionを呼び出す。
MSN Japan - ニュース, 天気, メール (Outlook, Hotmail), Bing検索, Skype
IDEA * IDEA
JavaScriptでDOMに挑戦 (1/2)：初心者のためのJavaScript入門（7） - ＠IT