マンガで分かる JavaScriptプログラミング講座
はじめに 「マンガでわかるJavaScript」は、難しそうに思えるプログラムを、簡単そうに見えるマンガで解説するという初心者向けの入門講座です。 架空の高校生たちに教える形式で、プログラムの基礎から応用を、解説していきます。一通りのマンガを読めば、かなり実践的なところまで、プログラムを書けるようにしていきます。 （マンガは、左上から右下へと読みます） プログラムというと、けっこう大変そうに思えますが、この講座のテーマは「面倒くさいことを楽にする」です。面倒臭がりで、手抜き大好きの女子高生を主人公にして、楽しくプログラムを学んでいくことにします。 主な対象読者は「これからプログラムを学んでみたい人」「Webの世界に関わっていてJavaScriptを学んでみたい人」「昔JavaScriptを触っていたけど最新のトレンドが分からないので改めて学んでみたい人」などです。初心者だけでなく、Webデ
JavaScriptでできること・できないこと
さまざまなプログラミング言語がありますが、プログラミングそのものに触れてみたいと思うならJavaScriptをお勧めします。Webブラウザとメモ帳があれば、本格的なプログラミングに挑戦できるのです（編集部） プログラミングを学びたいと思ったら 皆さんは、JavaScriptというと何を思い浮かべるでしょうか。 Webで動的なユーザーインターフェイスを実現するための技術でしょうか。それとも、オブジェクト指向のスクリプティング言語でしょうか。JavaScriptというキーワードを聞いたことがある程度という方もいるでしょう。 JavaScriptは現在多くのWebブラウザに搭載され、さまざまな場面でWebの中核技術を支えているスクリプティング言語です。 本連載は、プログラミングを初めて学ぶ人を対象にしたJavaScriptの入門記事です。特に次のような方のために分かりやすく解説を行っていきます。
プロトタイプ（prototype）によるJavaScriptのオブジェクト指向
はじめに JavaScriptはオブジェクト指向言語です。しかし、そのオブジェクトの性質は、他に良く知られているオブジェクト指向言語のJavaやC++と大きく異なっています。 そこでこの記事では、なぜそのような違いがあるのか、JavaScriptにおけるオブジェクト指向の言語思想を見ていくと共に、その違いの根幹であるプロトタイプについて解説していきたいと思います。 なお、この記事はJavaScriptの解説ですが、その内容は、標準仕様のECMAScriptで扱われる範囲に基づいています。従って、同じくECMAScriptを元にしている言語（JScript、ActionScript）でも通じる内容になっています。 対象読者 プログラミングの基本的な知識、ならびにオブジェクトやメソッドと言った基礎的な概念については、ここでは解説しません。最低限、オブジェクト指向プログラミングについて理解をして
Javascriptでtry-catchを使う
Javascriptでtry-catch構文が使えるって知らない人が多かったので書いてみました。 （最近じゃAjaxでほぼ必須だから認知度高いかもしれないけど。） try{エラーをキャッチしたい処理内容}catch(e){エラーをキャッチしたら行う処理内容} プログラミング言語に慣れている方はすんなり受け入れられると思いますが、どんなプログラムでもこの例外処理が大変重要です。 Javascriptではそんなに厳しく例外処理をする必要ないかもしれないけど、使ったら便利ってことがよくあります。 それは、ブラウザが返却するエラーをキャッチすることです。 IEではよくあるのですが、windowのリサイズや移動、またはファイルのアップロード時など、セキュリティ上の都合で、ブラウザからエラーが返されてしまいます。 そうするとその後の一切の処理ができなくなり大変都合が悪いです。 なので、このブラウザから
タイプ別オンライン英会話のおすすめ37選【2023年】TOEIC対策や子供向け・日常会話の学習に | ベストクリア
おすすめのオンライン英会話を徹底比較 ピッタリのオンライン英会話を見つけよう スキマ時間に外出先でも英語学習ができる人気のオンライン英会話 おすすめのオンライン英会話を特徴やメリットで徹底比較 料金や無料体験、学習スタイルが分かる 目的別オンライン英会話おすすめ 幼児・子供向けにおすすめの14社 TOEIC対策におすすめの7社 英検対策におすすめの4社 日常会話の習得におすすめの8社 カランメソッドが受講できるおすすめ4社 日常会話の習得におすすめのオンライン英会話 オンライン英会話は、スキマ時間を活かして、自宅や外出先でも気軽に英語に触れることができる点が最大の特徴です。 英語の習得には、たくさんの方法がありますが毎日少しづつでも英語に触れることが近道です。日常生活で利用できるレベルの英語の学習におすすめのオンライン英会話です。 子供の英会話上達の近道 DMM英会話 2回の無料体験レッス
第3回 変数の宣言とスコープ ― ＠IT
JavaScriptが、いま注目を浴びている。 長い冷遇の時代を経ながらも、Ajaxという技術の登場とも相まって、JavaScriptの価値はいままた確実に見直されつつある。その過去の凋落と近年の華々しい脚光は、「復権」と呼んでもよいかもしれない。 本連載は、JavaScript復権のいまこの時代に求められる、JavaScriptという言語への理解を再確認しようというものだ。その連載、第3回となる今回扱うテーマは、「変数」である。どのような言語においても同様であるが、コード上で値を入力し、処理した結果を格納し、また、ほかへと引き渡すすべての基本となるのが変数だ。プログラミング言語を理解するうえにおいて、変数の理解は欠かせない。そして、それはJavaScriptの世界においても同様だ。 本稿では、JavaScriptにおける変数のデータ型に始まり、そのスコープ（有効範囲）の概念、そして、初学
JavaScriptの変数とスコープ - Archiva
Make a note of it: Web tech, montaineering, and so on. Note: この記事は、3年以上前に書かれています。Webの進化は速い！情報の正確性は自己責任で判断してください。 一度しっかり試しておきたかった変数とその有効範囲について。 JavaScriptには変数の型という考え方がない（任意のデータ型の値を代入できる） JavaScriptでサポートされるデータ型には、基本型と参照型がある 参照型の変数には、参照が格納される（実際のデータ値ではない） 関数、配列、オブジェクトなどが参照型 変数の有効範囲を、その変数のスコープという 暗黙的に宣言された変数は、必ずグローバル変数になる 関数の内部で暗黙的に宣言された場合でも、グローバル変数になる var文で宣言した変数は、ローカル変数になる ローカル変数のスコープは、その変数が宣言された関数の
JavaScriptリファレンス-ブラウザ関連クラス - JavaScriptist
JavaScriptリファレンス | JavaScriptリファレンス-ブラウザ関連クラス | リファレンスABCインデックス prototype.jsリファレンス | scriptaculousリファレンス ナビゲーター-navigator bookmark navigator.appCodeName | navigator.appMinorVersion | navigator.appName | navigator.appVersion | navigator.cookieEnabled | navigator.cpuClass | navigator.javaEnabled | navigator.onLine | navigator.platform | navigator.systemLanguage | navigator.userAgent | navigator.user
【インフォシーク】Infoseek ： 楽天が運営するポータルサイト
日頃より楽天のサービスをご利用いただきましてありがとうございます。 サービスをご利用いただいておりますところ大変申し訳ございませんが、現在、緊急メンテナンスを行わせていただいております。 お客様には、緊急のメンテナンスにより、ご迷惑をおかけしており、誠に申し訳ございません。 メンテナンスが終了次第、サービスを復旧いたしますので、 今しばらくお待ちいただけますよう、お願い申し上げます。
JavaScript の有効/無効を判定（判別）して表示する内容を変更する方法 :: Drk7jp
相変わらず（ってか仕事でだけど） JavaScript ネタがちょっと旬な今日この頃です。 ・・・っていってもこれまた世の中で旬な jQuery とか XPath の話じゃありません。 さて今回は、JavaScript が有効であることが前提のサイトを作る場合に、ブラウザの設定で JavaScript が無効になっている場合はページの表示をどうするか？っていう話です。JS が無効になっていたら有効にする設定は？ページみたいなのに誘導するアレです。 試しに Gmail を JS 無効でひらいてみた。当たり前だけどちゃんとエラーページが表示されました。 さて JS 無効時の処理方法として２つの方法があると思ってます。（ってか他にももっとあるかもしれませんが、今ぱっと思いつきませんでした・・・） 1. 基本エラーページを表示していて、JS 有効時に正常なページを表示する 2. JS が無効なら
Collection & Copy - [翻訳]JSON in JavaScript
翻訳 原文：JSON in JavaScript JavaScriptは、 Netscape Navigator用のページスクリプト言語として広まった汎用のプログラミング言語です。Javaのサブセットであると広く信じられていますが、それは違います。Cのような構文とソフトオブジェクトをもつSchemeに類似した言語です。JavaScriptは、ECMAスクリプト言語仕様-第3版で標準化されました。 JSONの表記法は、JavaScriptのリテラルオブジェクトの表記法のサブセットです。JSONはJavaScriptのサブセットであるため、あれこれ悩まずにJavaScript言語で使用できます。 var myJSONObject = {"bindings": [ {"ircEvent": "PRIVMSG", "method": "newURI", "regex": "^http://.*"
Life is beautiful: Javascript、クロージャを使ったプライベート関数の隠蔽について
（このエントリーは「Javascriptクイズ：無名関数と実行効率の話」の続編。） 「？？？」と頭をかしげる太郎に、「じゃあ、これだったらどうかな？」と三郎はコードを書き始めます。 function code2name(code) { var mapping = { 'us': 'United States', 'ja': 'Japan', 'ko': 'Korea', 'ru': 'Russa', 'uk': 'United Kingdom', 'fr': 'France', 'cc': 'China', 'gw': 'Germany' }; return mapping[code] || '(unknown)'; } 「カントリーコードを国名に変換しているんですね。」と太郎。 「どこが問題だか分かる？」 「うーん、マッピングのためのオブジェクトを毎回作り直しているところかな。」 「そう
DOMのJavaScriptイベントハンドラは引数が固定されている、という制限を回避する方法 - IT-Walker on hatena
これもはまって、解決策がなかなか見つからなかった・・ どういうことかというと、良くある話です。 DOMを使って、onclickプロパティに関数を代入したり、addEventListener/attachEventメソッドを使用してイベントハンドラを登録したりするとき、その関数に引数を渡したい時があります。 普通は、DOMのイベントハンドラと言えば引数なしか、イベントオブジェクトを一つとるものしか受け付けられません。つまり、HTMLの属性を用いた昔ながらの方法だと以下のコード内のrowSelectedに該当することが、DOM + イベントハンドラの設定では実現できないことになります。 <table> <tr onclick="rowSelected('0');">..</tr> <tr onclick="rowSelected('1');">..</tr> </table> 例に挙げたこのテ
JavaScript の要素追加・変更で innetHTML と DOM の速度検証
ちょっと昔に散々でまわったネタなんですけど・・・まぁ自分への備忘録っつーことで。 JavaScript でごにょごにょ動的に見た目を変更する社内ツールがあります。自分が作ったヤツなんですが、最近どうにも動きがモッサリしてきました。解析するまでもなく遅い原因は DOM で要素を追加・削除を大量にやっているのはわかっています。だいぶ前に DOM と innerHTML のどっちが高速化ってのが話題になった時期がありましたが、僕の経験（技を何も使わずに単純に DOM 操作を書く場合。というか普通の人の書き方がココに当てはまると思う。）では圧倒的に innerHTML が高速な場合が多いです。 ※innerHTML vs DOM ネタはこの辺が参考になります。 Javascript - Benchmark - W3C DOM vs. innerHTML 最速インターフェース研究会 :: 日本語テキ
【コラム】そろそろきっちりJavaScript (1) "Firebug"の導入〜関数リテラルとは? | エンタープライズ | マイコミジャーナル
多彩な演出効果をカンタンに導入できる事で脚光を浴びたprototype.jsの登場を皮切りに、インターネットで公開されているJavaScriptライブラリの数は、この一年で急激に増加した。何かやりたいことがあったときはWebで検索すれば、大抵、どこかにライブラリが転がっている。便利な世の中になったものだ。 一方、Webを通じて提供されるサービスは多様化の一途を辿っている。JavaScriptライブラリは整ってきたが、当然、置くだけでは機能しない。ライブラリのサポートページには簡単なサンプルが載っているものの、サンプルがそのまま適用できるケースはごくわずかだ。しかたなく、他の誰かが似たような事をやっていないかとWeb検索するはめになる。 思えば、これまでJavaScriptを言語としてとらえ、きっちり向き合う機会は少なかったのではないだろうか。 1995年の終わり、Netscape Navi
JavaScript でダブルクォーテーションを扱う
CSSやHTML、そしてJavaScriptについてリファレンス的に扱ってみたいと思います。もちろん実践的なものも。 JavaScriptにある程度精通した人なら、「"（ダブルクォーテーション）」の扱いに頭を抱えている人もいるでしょう。 以下の例を見てください。 <a href="javascript:void(0)" onClick="PrintFontTag('<font size="+2"></font>')"> どんな言語であれ、ある程度プログラムをかじったことがある人ならば、上の「おかしい」部分にすぐに気がつくでしょう。 そう「onClick」イベントハンドラで指定したメソッドの中に「"」が含まれてしまっている。 つまり、"の中に"が入ってしまっている。 たいてい他の言語では「\」記号でエスケープしてやればいいわけですが、JavaScriptの場合はうまくはいきません。
「Webクリエイティブのための」シリーズ - Web Designing Books
WebクリエイティブのためのCMSツールガイド エ・ビスコム・テック・ラボ［著］ ISBN978-4-8399-2468-3 2007/11発売 サンプルファイル 本書で使用しているサンプルやテンプレートなどのデータをダウンロードできます。 cms-tool.zip(1.3MB） WebクリエイティブのためのCMSテンプレートデザイン エ・ビスコム・テック・ラボ［著］ ISBN978-4-8399-2467-6 2007/09発売 サンプルファイル 本書で使用しているサンプルやテンプレートなどのデータをダウンロードできます。 cms-template.zip(1.9MB) ※お詫び（2007/12/11）：ダウンロードファイル中にいくつかミスがございましたので、ファイルを差し替えました。 変更があったのは、 cms-template/sample01/wp/temp-wp-date.txt
[使える CSS テクニック] CSSを使った見栄えの良いフォーム | バシャログ。
第 8 回目は「CSSを使った見栄えの良いフォーム」です。 フォームまわりは、各ブラウザによってかなり差異があります。 よって CSS だけで見栄えをよくしようとすると、結構手間だったります。 例をあげると magin・paddingが異なる borderの線がでない 背景が画像があたらない などなど そんな時に便利なのが 「niceforms」 という javascriptライブラリです。 すいませんが、今回だけは javascript を使わせてください。 niceforms のサンプルはこちら 導入方法 まずは、niceforms をダウンロードします。 次に、必要な jsファイル および cssファイル をインクルード。 <script language="javascript" type="text/javascript" src="niceforms.js"></script>
![[使える CSS テクニック] CSSを使った見栄えの良いフォーム | バシャログ。](https://cdn-ak-scissors.b.st-hatena.com/image/square/1f4390ea5b2b558adfd9c349b9a080aae407daff/height=288;version=1;width=512/https%3A%2F%2Fbashalog.c-brains.jp%2Fshared%2Fpublic%2Fimg%2Fcommon%2Ficon_ogp02.png)
JavaScript-XPath をリリースしました！さあ、あなたも XPath を使おう！（解説付き） - IT戦記
JavaScript-XPath とは JavaScript-XPath は、 DOM 3 XPath を実装していないブラウザに対して、実用的な速度で動作する DOM 3 XPath のエンジンを追加します。 一言で乱暴に言ってしまえば、どのブラウザでも document.evaluate って関数で XPath 使えるようになるよ！ってことです。 以下が公式サイトになります。 http://coderepos.org/share/wiki/JavaScript-XPath DOM 3 XPath ってなんなの！？ めっちゃ簡単（で、ちょっとだけ適当）なDOM 3 XPath の説明をします＞＜。 JavaScript でよく使う document.getElementById や document.getElementsByTagName って関数ありますよね？ DOM 3 XPath
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Ajaxはじめの一歩 XMLHttpRequest [Javascript] All About![Ajaxはじめの一歩 XMLHttpRequest [Javascript] All About](https://cdn-ak-scissors.b.st-hatena.com/image/square/8f530daf3cb408d6b6a0ba6f38ed7ccece36cffc/height=288;version=1;width=512/https%3A%2F%2Fimg.aacdn.jp%2Faa%2Fcommon%2Fogp300_300.png)
