第1回 JavaScriptの復権 ― ＠IT
連載目次 JavaScriptが、いま注目を浴びている。JavaScriptの復権、といってもよい。 最初にJavaScript（当初は「LiveScript」と呼ばれていた）がブラウザに実装されたのが1995年の「Netscape Navigator 2.0」というWebブラウザでのことであるから、すでに登場から10年以上も経過しているわけであるが、そんな枯れた言語がなぜいまごろになって注目されているのか。 いうまでもない。昨今、GoogleやYahooをはじめとした多くの企業が積極的にJavaScriptを採用したリッチなユーザー・インターフェイスを公開し、これが「Ajax（Asynchronous JavaScript And Xml）」という名前とともに急速に注目を浴びたことが、その理由である（Ajaxについては拙稿「枯れた新しいUI革命「Ajax」をASP.NETで活用する」を参
第2回 JavaScriptの関数をマスターしよう － ＠IT
JavaScriptが、いま注目を浴びている。 前回も紹介したように、JavaScriptが復権を果たした背景にはさまざまな要因が考えられるが、その契機ともなったキーワードを1つだけ挙げるとするならば、「Ajax（Asynchronous JavaScript And Xml）」を外すことはできないだろう。Ajaxという技術の登場によって、JavaScriptによるリッチなユーザー・インターフェイス構築の可能性が示されたことで、JavaScriptの価値は確実に見直されつつある。 本連載は、JavaScript復権のいまこの時代に求められる、JavaScriptという言語への理解を再確認しようというものだ。連載初回ではまずJavaScriptの苦渋の10年間を振り返りながら、JavaScriptという言語にまとわりつく誤解の払拭を試みた。JavaScriptという「不遇な」言語にこれまで向
ブラウザを選ばずWebテストを自動化するSelenium
Webアプリケーションのファンクションテストを行うツールとして注目されている「Selenium」のバージョン1.0が6月20日にリリースされました。安定性が向上するとともに、Firefox 3.0、3.5（Selenium IDEは1.0.2から、Firefox 3.5に対応）や、Internat Explorer（以下、IE） 8などの最新のWebブラウザにも対応しました。 本稿では、Selenium 1.0をベースとしたSelenium IDEとSelenium RCを利用した効果的なSeleniumの利用方法を紹介します。 Webアプリのテストで誰もがイラつく大きな課題 Webアプリケーションテストを手で行うと、非常に煩雑です。Selenium登場以前の従来のやり方では、次のような問題がありました。 回帰テストに時間がかかる バグ修正や仕様変更などで、Webアプリケーションを変更した
基礎第一回 — JavaScript初級者から中級者になろう — uhyohyo.net
基礎第一回このページの最終更新日：2019年7月4日 JavaScriptの書き方基礎のページでは、JavaScriptを1から解説します。JavaScriptはもともとインターネットブラウザ上で動くプログラミング言語として誕生しました。ここでは、それに倣ってブラウザ上、つまりウェブページの上でJavaScriptを動かしてみましょう。 ブラウザが表示するウェブページというのは、HTMLにより記述されています。この講座ではHTMLの解説はしません。HTMLが分からないという人は、軽くでいいのでどこかのウェブサイトで勉強しておくとよいでしょう。 さて、ウェブページ上でJavaScriptを動かすには、scriptという要素を使います。 <!doctype html> <html> <head> <title>test</title> </head> <body> <script type="
十章第一回 XPathとは — JavaScript初級者から中級者になろう — uhyohyo.net
十章第一回 XPathとはこのページの最終更新日：2018年6月2日 十章では、またDOMの話題に戻ってXPathを解説します。 XPathとは、木構造中のノードを指し示す表現のことです。ノードは1つでもいいし複数でも構いません。 具体的な例として、例えば「body要素中の最初のp要素」とか、「3番目のa要素」とかそういった指定が可能です。そういわれるとCSSのセレクタを思い浮かべるかもしれません。しかし、XPathはCSSセレクタよりも数段強力な表現力をもちます。 JavaScriptのDOMにおいては、このあるノードを表す表現を条件として使うことで、対応するノードを絞り込んで処理することができます。 これは、例えば「要素名」という条件に限ればgetElementsByTagNameでできていました。また、getElementByIdも条件によりノードを絞り込んでいるといえるでしょう。
Maraigue風。:[JavaScript][メモ] ブラウザによるinnerHTMLの挙動の違い
2009年05月24日 [JavaScript][メモ] ブラウザによるinnerHTMLの挙動の違い JavaScriptの「innerHTML」は、HTMLにおいて特定の要素の内部に含まれる成分を、HTML形式の文字列として取得するものだが、必ずしもHTMLソースの内容をそのまま返してくれるわけではない模様。これで30分はまった。 参考リンク。 Postal Search APIs & Solutions ブログ: ブラウザによって .innerHTML の結果が異なるので jTemplates に置き換えました Development Reference｜JS ブラウザによるinnerHTMLの取得値の差異 電撃羊の‘あしあと’: innerHTMLの非互換性 無窮 i ラボ Blog innerHTMLとスペースのクロスブラウザ問題 ということで、主要なブラウザでinnerHTML
prompt-JavaScript入門
HOME JavaScript入門 prompt あるサイトを訪れた時、インプットボックスが現れて名前の入力が求められたという経験はありませんか？ 入力すると自分の名前がサイト内に表示されたりしますね。 ここではそんなインプットボックスを出す方法について解説してみます。 インプットボックスの使い方 インプットボックスを出すにはprompt()を使います。 変数 = prompt( "質問文" , "最初に表示する文字" ); インプットボックスを出します。 カッコ内の最初の項目は質問文、2番目の項目は初期表示文字を指定します。 ユーザーの入力した文字列は、変数に代入されます。 以下のスクリプトは、promptを使って名前を入力してもらい、 入力文字をページ上に表示するサンプルです。 <script> var str; //入力文字を入れる変数 //インプットボックスの表示＆入力文字をstr
四捨五入・切り上げ・切り捨て－JavaScript入門
HOME JavaScript入門 四捨五入・切り上げ・切り捨て このページでは、数字を四捨五入や切り上げ、切り捨てをして整数にまとめる方法について解説します。 JavaScriptではいろいろな場面で大変よく使います。記述自体は簡単なので、しっかり覚えて下さい。 さらにこのページでは、整数以外に丸める方法についても考えます。 小数二桁などに丸めたいこともあるでしょう。 金額などを扱う場合は千円単位、万円単位で丸めたいこともあると思います。 実際丸める桁数を変えることはできないのですが、ほんのちょっとした工夫で可能になります。 その方法についても見ることにしましょう。 では以下のスクリプトをHTMLのBODY内に記入してみてください。 <form name="marume"> <input type="text" value="3.14159">：丸める数字<br> <input type
DOMでできること－JavaScript入門
HOME JavaScript入門 DOMでできること ここからDOM（Document Object Model）というJavaScriptの機能について解説していきます。 「DOMとは何か？」ということを説明しようと思うと結構専門的な用語を使う必要がありますし、 私も正確に理解しているわけではありません。 それでこの説明は他サイトに任せるとして、DOMでどんなことができるか、 またその為に必要な知識についてこのページで説明したいと思います。 DOMを使うと何ができるのか？ DOMを使うと、ページの再読み込みをすることなく、 ページの一部を書き換えたり、 スタイルを変更したりすることができます。 例えば以前に世界時計を作成しました。 その際、時刻はフォームのテキストボックスに表示したと思います。 テキストボックスは書き換えが可能だからです。 しかしdocument.write()は読み込
javascriptで開いたウィンドウに値を渡す - OKWAVE
＞Firefoxでもできる方法があれば嬉しいです。 前回答では、検証等をちょっと端折ったので気付きませんでしたが function hoge() {field.value=window.opener.field.value;} という記述が略式の書き方なので、問題があったようです、推奨形では getElementById メソッド で エレメント を指定すべきでしたか。。。 pc_web さんご自身が sub.html の中に書いていらっしゃる set() 関数の記述 window.opener.document.getElementById("field").value = document.getElementById("field").value が OK です。 これをそのまま左辺・右辺を入れ替えて function hoge() {document.getElementById(
HTMLでのid とnameの違い
HTMLとJavaScriptを使ってWebページを作っていますが、 id と name の使い分け方がよくわかりません。 id は各エレメントに個別に与える識別子と認識していて、getElementById() メソッドなどでよく使うのですが、それと name プロパティーはどう違うのでしょうか？ あるサンプルコードに次のようなものがありました。 <a href="http://www.google.com" name="google_link"> <img src="google.gif" id="engine-1" alt="google graphic"> </a> というHTML部分があり、しばらく後に function show_attribs() { var attribs=""; attribs += "Link name: " + window.document.getE
オープン元参照＆ウィンドウを閉じる-JavaScript入門
HOME JavaScript入門 オープン元参照＆ウィンドウを閉じる このページでは、サブウィンドウからオープン元である親ウィンドウの情報を取得する方法について解説します。 またサブウィンドウを閉じる方法についても解説します。 オープン元のファイル まずオープン元のHTMLファイルには以下のように記入します。 <button onclick="winOpen()">サンプル</button> <form name="sample"> <input type="hidden" name="suji" value="12345"> <input type="hidden" name="moji" value="あいうえお"> </form> <script> function winOpen(){ window.open("subwin.html","sub"); } </script> フ
window.openのオプション-JavaScript入門
HOME JavaScript入門 window.openのオプション 以前はwindow.openで開いた別窓にメニューバーやスクロールバーのON/OFFを指定できましたが、現在のブラウザではそうした指定は無視されるようになりました。幾つか使える設定も残っているものの、いずれ使えなく可能性も高いので、ここの解説は削除することにしました。ご了承ください。 前へ 次へ
サブウィンドウを表示する-JavaScript入門
HOME JavaScript入門 サブウィンドウを表示する ここでは、JavaScriptでサブウィンドウを表示する方法について解説します。 HTMLでも別ウィンドウは出せますが、 JavaScriptを利用するとウィンドウの位置や大きさを指定できます。 何かと使い道の多いスクリプトですので、是非マスターして下さい。 普通にサブウィンドウを表示する サブウィンドウを表示するには、以下のように記述します。 window.open("URL","ウィンドウ名") 指定したウィンドウ名でサブウィンドウを表示させます ウィンドウ名は、HTMLのターゲット名と同じです。 同じウィンドウ名を指定すると、そのウィンドウに指定したページが表示されます。 ウィンドウ名を空にすると、target="_blank"と同じことになります。 サブウィンドウを開くサンプル HTMLに以下のように記述してみてください
JavaScript入門
HOME JavaScript入門 ここでは、ビギナーの方を対象としたJavaScriptの解説を行っています。 JavaScriptは、Webページに組み込んでいろいろなアクションを起こすことができます。 是非JavaScriptを覚えて、一ランク上のWebページ作りに励んでみて下さい。 当サイトでは主に「初めてJavaScriptを触る人」、特にプログラム自体初めての方を対象にしています。 初めての方は様々な専門用語が出て来ると非常に難しく感じることがあるので、ここでは極力専門用語を使わないようにしています。 ここで書かれてあることをマスターしたなら、 後は色々なサイトでレベルを磨いていってください。 なお最初に断っておきますが、JavaScriptを理解するにはHTMLをある程度使える必要があります。 HTMLを十分使えない方は、まずそちらを勉強なさって下さい。 HTMLを理解してい
JavaScriptの記入場所-JavaScript入門
このページでは、JavaScriptを記入する場所と記入の仕方について解説します。基本的には上図の４箇所に記入します。 ヘッダー内に HTMLのヘッダーに記入します。ここに書いたスクリプトは、body部分より前に読み込まれます。 先読みしておきたい画像や関数（処理を１まとめにしたもの）等を記入します。 body内に 何かを表示するようなスクリプトの場合、実際に表示する位置に記入します。 最近はbody最下部にJavaScriptを記述することが良いとされています。 タグ内に タグの中にイベントを組み込んで、そこに直接JavaScriptを記入できます。 関数を呼び出したり、簡単なスクリプトを記入します。 最近ではあまり使われなくなりました。 外部ファイルに 複数のWebページ内で同じ処理を行いたい場合は、外部ファイルにスクリプトを書いて、 それを各ページが読み込むようにします。 JavaS
JavaScriptのコードを記述する上での基本ルール
大文字と小文字の区別 JavaScript では大文字と小文字は明確に区別されます。変数に名前を付ける時や、または既に定義されている予約語を使う場合には大文字小文字も正確に記述する必要があります。 次の例を見て下さい。 let name = 'Yamada'; console.log(name); >> Yamada console.log(Name); >> Uncaught ReferenceError: Name is not defined 変数 name に値を代入したあと、コンソールに変数 name の値と 変数 Name の値を出力しています。 JavaScript では大文字と小文字は区別されるため変数 name と変数 Name は別の変数です。よって console.log(Name) の方は変数 Num が定義されていないためエラーとなります。
JavaScript入門
JavaScript はクライアント側で実行されるオブジェクト指向型のスクリプト言語です。 JavaScript を用いることで、動的にWebページの内容を書き換えたりフォームに入力された内容をクライアント側でチェックしたりできます。ここでは JavaScript の使い方として JavaScript のプログラミングの方法をサンプルを用いて解説していきます。
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
「WebFormの背景色の変更」（1） Insider.NET － ＠IT
Amazon.co.jp: 初めてのPHP、MySQL、JavaScript&CSS 第2版: Robin Nixon (著), 永井勝則 (翻訳): 本
