初心者のためのホームページ作り:第101号

                隔週金曜日配信 What's New 2004年9月17日
□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□

  ┏┏┏┏   初心者のためのホームページ作り/Web for beginner
  ┏┏┏         http://www.scollabo.com/banban/
  ┏┏
  ┏              <第101号>

                banban@scollabo.com

□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□

  当講座は、初心者や中級者が正しい文法と作法を身につけて、プロ級の本格
 的な Webページ作成に役立つことを目的に配信されております。

  当講座では HTML4.01、XHTML1.1、XML1.0 を中心とした文法が主体となって
 います。なお、このマガジンは等幅フォントでお読みいただくと快適に読める
 ようになります。

   今週のコンテンツ
    ■ JavaScript講座 (第21回) --- Stringオブジェクト
    ■ WindowsXP ServicePack2 対策
    ■ お詫びと訂正

□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□

◆JavaScript講座 --- Stringオブジェクト

 Stringオブジェクトは、その名のとおり「文字列」を扱うオブジェクトです。
 このオブジェクトを使って、文字の装飾や検索、抜き出しなど様々な文字列に
 対するスクリプトを作成できます。

 ■Stringオブジェクトのメソッド
 文字列の内容を参照したりするためのメソッドは、以下のように定義されて
 います。

 メソッド名        機能
 ---------------------------------------------------------------------
 big      文字列のサイズを大きくする 
 blink     文字列を点滅させる 
 bold     文字列を強調文字にする 
 charAt    指定した位置の1文字を抜き出す 
 charCodeAt  指定した位置の文字の文字コードを返す (2バイト文字も可)
 concat    文字列と文字列を連結する

 find     ドキュメントから文字列を検索する
 fixed     文字列を等副フォントに変換する 
 fontcolor   文字列の文字色を設定する 
 fontsize   文字列の文字サイズを設定する 
 fontCharCode アスキーコードを文字に変換する
 indexOf    指定した文字列を検索する

 italics    文字列の字体を斜体 (イタリック) にする 
 lastIndexOf  指定した文字列を文字列の末尾から検索する 
 link     文字列にリンク先を設定する
 match     正規表現による検索を行い、一致した文字列を返す
 replace    文字列を指定した文字列に置き換える 

 search    一致する文字列があるか調べ見つかった位置を返す 
 slice     指定した範囲の文字列を抜き出す 
 small     文字列のサイズを小さくする 
 split     文字列を区切り文字で分割し、配列として返す 
 strike    文字列に抹消線を設定する 
 sub      文字列を下付き文字に設定する 
 substr    指定された位置から指定数文の文字列を抜き出す
 substring   指定した範囲の文字列を抜き出す 
 sup      文字列を上付き文字に設定する 
 toLowerCase   アルファベット文字列をすべて小文字に変換する 
 toUpperCase  アルファベット文字列をすべて大文字に変換する 

 ■Stringオブジェクトのプロパティ

 プロパティ名        機能
 ---------------------------------------------------------------------
 length    文字列の文字列長を返す (文字数を返す) 

 それでは順を追って、各メソッドについて解説します。

 □ big
 任意の文字列を大きく表示させます。HTMLの <big>文字列</big> と同じ役割
 をします。

  具体的な書式: 文字列.big()
   a = "JavaScript";
   document.write(a.big());
   変数 a に格納された文字列を大きくして表示します。

 □ blink
 任意の文字列を点滅して表示します。その昔、Netscape 4.x 以前で実装され
 ていた独自規格の <blink>文字列</blink> と同じ役割をします。
  なお、MSIE (Microsoft Internet Explorer) では実装されていません。

  具体的な書式; 文字列.blink()
   a = "JavaScript";
   document.write(a.blink());
   変数 a に格納された文字列を点滅して表示します。

 □ bold
 任意の文字列を強調 (太字) にして表示します。
  HTMLの <strong>文字列</strong> と同じ役割をします。

  具体的な書式; 文字列.bold()
   a = "JavaScript";
   document.write(a.bold());
   変数 a に格納された文字列を強調して表示します。

 □ charAt
 文字列から指定した位置の文字を1文字だけ抜き出します。

  具体的な書式; 文字列.charAt(取り出す文字の位置)
   a = "JavaScript";
   document.write(a.charAt(4));
   変数 a に格納された文字列の先頭から5番目 (先頭は 0 となる) の文字
   を抜き取ります。ここでは「s」がそれに当たります。最初の文字は 0 で
   あることに注意してください。

 □ charCodeAt
 文字列から指定した位置の文字を1文字を ISO Lathin文字コードに変換して
 出力します。なお、日本語などの全角文字 (非アスキー文字) も扱うことが可
 能となっています。

  具体的な書式; 文字列.charCodeAt(変換する文字の位置)
   a = "JavaScript";
   document.write(a.charCodeAt(4));
   変数 a に格納された文字列の先頭から5番目 (先頭は 0 となる) の文字
   を ISO Lathin文字コードに変換して出力します。最初の文字は 0 である
   ことに注意してください。

 □ concat
  指定した文字列を連結します。
  基本的には、文字列+文字列と同じ働きをします。

  具体的な書式; 対象となる文字列.concat(連結する文字列)
  a = "Java";
		b = "Script";
  str = a.concat(b);
  document.write(str);
   この表示結果は「JavaScript」となります。

 □ find
 ページ内の指定された文字列を検索します。検索された文字列が見つかった場
 合、その位置にカーソルが移動します。 (MSIEではサポートしていません。)

  具体的な書式; 対象となる文字列.find(検索する文字列)
  a = "JavaScript";
  check = myString.find(a);
  ページ内の myStringに格納される文字列から「JavaScript」という文字列
  を検索します。

 □ fixed
 指定した文字列を等副 (固定ピッチフォント) で表示させます。

  具体的な書式; 文字列.fixed()
  a = "JavaScript";
  document.write(a.fixed());
   変数 a に格納された文字列を等副フォントで出力します。

 □ fontcolor
 指定された文字列の文字色を設定します。文字色は16進数か、JavaScriptで定
 義されている色名を用います。

  具体的な書式; 対象となる文字列.fontcolor(色名、または16進数)
  a = "JavaScript";
  document.write(a.fontcolor("red"));
   変数 a に格納された文字列を赤色に設定して表示します。

 □ fontsize
 指定された文字列の文字サイズを設定します。大きさを指定できる文字のサイ
 ズは、1〜7 の範囲です。1 が一番小さく、7 が一番大きくなります。

  具体的な書式; 対象となる文字列.fontsize(1〜7 の範囲)
  a = "JavaScript";
		document.write(a.fontsize(5));
   変数 a に格納された文字列を、やや大きくして表示します。

 □ fontCharCode
 指定された ISO Lathin文字コードを、普通の文字に変換します。charCodeAt
 メソッドの逆になりますが、複数の文字コードを扱えます。

  具体的な書式; String.fontCharCode(対象となる文字コード)
    document.write(String.formCharCode(%u521D%u5FC3%u8005));
   ISO Lathin文字%u521D%u5FC3%u8005 を普通の文字に変換して表示します。

 □ indexOf
 文字列の先頭から指定した位置の文字を検索、参照します。一致した文字列が
 なかった場合には、-1 を返します。
  なお、検索対象となる文字列に、変数を指定することも可能です。

  具体的な書式; 文字列.indexOf(検索文字列、検索位置)
  a = "オープンソースソフトとしてLinuxは有名です"
    document.write(a);
    point = a.indexOf("Linux",0);
    document.write("Linuxは、" + point + "文字目です");
   変数 a に格納された文字列の先頭から「Linux」という文字列を検索し、
   その位置を返します。
    なお、先頭の文字が 0 であることに注意してください。

 □ italics
 指定した文字列を斜体 (イタリック体) にして表示します。

  具体的な書式; 文字列.italics()
  a = "JavaScript";
  document.write(a.italicsr());
   変数 a に格納された文字列を斜体で表示します。

 □ lastIndexOf
 文字列の末尾から指定した文字の位置を検索、参照します。indexOfメソッド
 の逆になります。検索位置を指定しなかった場合は先頭から順次検索します。

  具体的な書式; 対象となる文字列.lastIndexOf(検索文字,検索開始位置)
  a = "初心者のためのホームページ作り";
   document.write(a.lastIndexOf("ホ",16));
   変数 a に格納された文字列の末尾 (17文字目より) から、「ホ」という
   文字を検索し、その位置を表示します。

 □ link
 指定した文字列を、リンクとして設定します。
  基本的には、HTMLの <a href="URI">文字列</a> と同じ役割となります。

  具体的な書式; 対象文字列.link(URI)
  a = "Google";
		myLink = "http://www.google.co.jp";
  document.write(a.link(myLink));
    変数 a に格納された文字列をリンクとして設定しています。リンク先
    は、変数 myLink で指定した URI となります。

 □ match
 指定された文字列から正規表現による検索を行い、一致した文字列を返します。
 なお、正規表現で利用するキーワードは、以下のように定義されています。

  正規表現           キーワード
 ----------------------------------------------------------------------
 [ ]      [ ]内に指定した文字列と一致 
 [^ ]      [ ]内で指定した文字列以外の文字と一致 (改行文字を除く) 
 (r)      グループ化した文字列と一致 
 (r1)(r2)    それぞれのグループ化した文字列を連結した文字列と一致 
 (r1)|(r2)   それぞれの文字列の OR と一致 
 c       メタ文字ではない文字列と一致 
 \       これに続く文字をエスケープする 
 ^       先頭に指定した文字列と一致 
 $       最後に指定した文字列と一致 
 _       任意に指定した文字と一致 (改行文字を除く) 
 *       指定した文字列の中から 0回以上を検索する 
 +       指定した文字列の中から 1回以上検索する 
 ?       指定した文字列の中から 0回、あるいは 1回検索する 

  具体的な書式; 検索対象文字列.match(正規表現文字列)
  a = "初心者のためのホームページ作り".macth("ホ");
  document.write(a, "を検索しました。);
   変数 a に格納された文字列から、「ホ」という文字を、正規表現による
   検索を行い、その文字を返して表示します。

 □ replace
 文字列から、指定された文字列へ置き換えます。

  具体的な書式; 元の文字列.replace(置換え前文字,置換え後文字)
  a = "Web for beginner";
  document.write("置換え前の文字列", a);
  newWord = a.replace("beginner","senior");
  document.write("置換え後の文字列", newWord);
   変数 a に格納されている「beginner」の文字を「senior」に置き換えし
   て、その結果を表示します。

 □ search
 文字列の中から指定された文字列を検索し、一致する文字列が見つかった場合
 に、その位置を返します。indexOf と異なるのは、検索開始位置が必要ないの
 で比較的検索の幅が広がります。

  具体的な書式; 検索対象文字列.search(検索するキーワード)
  a = "Web for beginner";
  myWord = a.search("in");
  document.write("検索位置は", myWord, "です");
   変数 a に格納された文字列の中から、「in」という文字列を調べて、そ
   の位置を、変数 myWord に格納して表示します。

 □ slice
 文字列を指定した範囲で抜き出します。引数には抜き出したい文字列の開始位
 置と、終了位置を指定します。負数を指定すると、後ろから数えた位置となり
 ます。
  なお、開始位置、終了位置は 0 から数えますので、0 は 1文字目となるこ
 とに注意してください。 

  具体的な書式; 対象文字列.slice(抜き取り開始位置,終了位置)
  a = "JavaScript";
  b = a.slice(4,10);
  document.write("抜き出した文字は、", b, "です");
   変数 a に格納された文字列の中から、5番目の文字を10文字目まで抜き
   出し、その値を変数 b に格納してから表示します。

 □ small
 指定された文字列の大きさを小さくします。HTMLの <small>〜</small> と同
 じ役割となり、bigメソッドの逆になります。

  具体的な書式; 文字列.small()
  document.write("JavaScript".small());
   JavaScriptという文字列を小さくして表示します。

 □ split
 指定した区切り文字で分割し、その結果を配列として返します。なお、区切り
 文字はカンマや空白、スラッシュなど任意に設定できます。

  具体的な書式; 格納する配列名=文字列.split(区切文字)
  a = "Web for begginer support";
  b = a.split(" ");
  document.write(b);
   変数 a に格納された文字列の中から、空白で区切られた文字を変数 b に
   配列として格納します。格納されたデータは、カンマで区切られて表示さ
   れます。

 □ strike
 指定された文字列に抹消線をつけます。HTMLの <strile>〜</strike> と同じ
 役割となります。

  具体的な書式; 文字列.strike()
  document.write("JavaScript".strike());
   変数 a に格納された文字列に抹消線をつけて表示します。

 □ sub、sup
 subメソッドは下付き文字を、supメソッドは上付き文字を表現します。

  具体的な書式; 文字列.sub()、 文字列.sup()
  a = "2";
  document.write("水の化学式は、H", a.sub(), ”Oです。");
  H2Oの化学式の「2」を、下付き文字で表現します。

 □ substr
 文字列から、指定した位置から指定した範囲で文字を抜き出します。1文字目
 が 0 であることに注意してください。

  具体的な書式:  文字列.substr(開始位置, 抜き出す文字数)
  a = "JavaScript";
  document.write(a.substr(4,6));
   変数 a に格納された文字列の中から、5番目の文字から6文字抜き出し
   ます。返される値は、「Script」になります。

 □ substring
 文字列から指定した範囲の位置で文字を抜き出します。substrメソッドは文字
 数で抜き出しますが、このメソッドは「位置」で抜き出します。

  具体的な書式:  文字列.substring(開始位置, 終了位置)
  a = "JavaScript";
  document.write(a.substring(4,9));
   変数 a に格納された文字列の中から、5番目の文字から9番目の文字まで
   を抜き出します。返される値は、「Script」になります。

 □ toLowerCase、toUpperCase
 指定した文字列 (アルファベットのみ適用) すべてを、小文字、あるいは大文
 字に変換します。

  具体的な書式:  文字列.toLowerCase()、 文字列.toUpperCaswe()
  a = "JavaScript";
  document.write(a.toLowerCase());
   変数 a に格納された文字列を、すべて小文字に変換して表示します。

 □ length
 Stringオブジェクトで唯一定義されている lenghは、文字列の長さを参照しま
 す。返される値は数値となります。

  具体的な書式:  文字列.length
  a = "初心者のためのホームページ作り";
  document.write(a.length, "文字です。);
   変数 a に格納された文字列の文字数を表示しています。

 なお、Metscape、及び Mozillaでは、全角の日本語 (2バイト文字) の1文字
 は2、MESIは、非アスキー文字でも1文字は1として計算します。

 ※主だったメソッドとプロパティのの実行結果は「今週のおさらい」をご覧く
  ださい。 (下段に URI があります。)

□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□

◆Tips --- 文字列オブジェクト

 文字列をオブジェクトとして扱う場合には、明示的に宣言します。しかし、実
 際には、明示的に宣言しなくても文字列オブジェクトとして扱われるのが一般
 的になっています。

  a = new String("JavaScript");   明示的に文字列オブジェクトを生成
  a = "JavaScript";  明示しなくても文字列オブジェクトとして利用可能

□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□

◆WindowsXP Service Pack2 対策

 今月の2日よりリリースされた WindowsXP Service Pack 2 (以下SP-2) には
 かつてないセキュリティ機能を強化しました。昨今の脅威に対するマイクロソ
 フト社の回等です。
  すでに皆様の中には Windows Update よりダウンロードしてインストールし
 ている方もおられると思います。10月からは全国の郵便局や、PCショップでも
 SP-2の CD-ROMを無料で配布されることも予定されています。

 ■SP-2の問題点
 SP-2を適用した Microsoft Internet Explorer (以下MSIE) では Webページに
 埋め込まれているプログラムに対して警告を表示します。
  ActiveX (注1) を利用したコンテンツはすべてその対象にあり、Flash や
 JavaScriptなどのオブジェクトも含まれます。

  そうしたオブジェクトが埋め込まれたページを閲覧すると警告のダイヤログ
 ボックスが表示されます。
  「情報バーにお気づきですか?
    ポップアップウィンドウや、安全でない可能性のあるファイルのダウン
    ロードが IE でブロックされると、情報バーで警告します。
    Webページが正しく表示されない場合、ブラウザ上の上の部分に表示さ
    れる情報バーをご覧ください。」

 ダイヤログボックスのとおり、「情報バー」と称せられるブロックには、以下
 のような説明文があります。
  「セキュリティ保護のため、コンピュータにアクセスできるアクティブコン
   テンツは表示されないよう Internet Explorer で制限されています。
   オプションを表示するには、ここをクリックしてください。」

 閲覧者は、情報バーをクリックしてオブジェクトをブロックするか許可するか
 を選択することになります。
  ページにスクリプトや動画を埋め込んだ場合、SP-2を適用したコンピュータ
 は常に警告のメッセージが現れ、その都度閲覧者は余計な操作を強いられるこ
 とになります。悪意を持ったサイトから身を守るという点では非常に効果があ
 りますが、そうしたサイトは実際には少ないものです。

 しかしながら、圧倒的多数のページで ActiveXを利用したコンテンツを採用し
 ている現実を考えると、当分混乱は続きそうです。

 ■SP-2の強化された機能
 1.ネットワーク保護          (Windows ファイアウォール機能)
 2.メモリ保護                (最新技術で再コンパイルされたコードの提供)
 3.安全性の高い電子メール処理 (添付ファイル処理に関するAPIの強化)
 4.ブラウズのセキュリティ強化 (ポップアップブロック機能)
 5.コンピュータの保守性の向上 (自動更新機能)

 ■SP-2への対策
 トップページで ActiveX を利用するコンテンツ作りを避けることが賢明です。
 初めて訪れる閲覧者にとって、不要な警告を与えて緊張させると、どうしても
 不安になってしまいます。
  ActiveX を利用するコンテンツは別のページで用意し、その趣旨をあらかじ
 め説明しておいたほうが安全でしょう。

 なお、マイクロソフト社では Web制作者に向けた対応について同社のサイトで
 掲載していますので、ぜひともご一読ください。

 SP-2への対応
 http://www.microsoft.com/japan/msdn/windows/windowsxp/xpsp2websites.asp

 SP-2 Webサイトの最適化
 http://www.microsoft.com/japan/msdn/windows/windowsxp/xpsp2web.asp

 ■SP-2インストールの注意点
 WindowsUpdateより SP-2をインストールする場合、そのダウンロードファイル
 は 100MB前後になります。今月末より WindowsXPユーザでは、自動更新により
 ダウンロードされますが、ナローバンドでの通信時間に注意してください。
  マイクロソフト社では、SP-2に限って自動更新を止めるためのツールも用意
 していますので利用するのも方法です。
  主要都市では本日から、また来月より全国の郵便局などで無償で配布されま
 すので、それを利用するようにしましょう。

  自動更新停止ツールのダウンロード (2005年4月12日まで有効)
   http://go.microsoft.com/?linkid=988173

□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□

◆お詫びと訂正

 前回「第100号」で掲載したスタイルシートのサンプルに間違いがありました。
 ここに訂正し深くお詫びいたします。

  誤 import url("sample_100-2.css");
  正 @import url("sample_100-2.css");

  importの冒頭でアットマーク「@」が抜けていました。

□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□

今回はここまで。

 今週のおさらいは Webページにも掲載しましたので、是非参考までに見ておい
 てください。
  Webページでは HTML文の実行結果のサンプルもあり、より分かりやすく説明
 しています。あわせて過去の記事のおさらいも掲載しています

 (今週のおさらい)
  http://www.scollabo.com/banban/magazine/review_101.html

  次回は、10月1日に配信を予定しています。

□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□

◆質問・ご意見ははこちらまで→ banban@scollabo.com

 なお、ご質問の際には、あなたがお使いのOS、ブラウザ、テキストエディタな
 ど、なるべく分かりやすく制作環境を明記していただけると回答しやすくなる
 と思います。
  ただし、個人的な事由により返事が遅れることがあります。ご了承ください。
 お急ぎの場合には、当サイト内の掲示板をご利用ください。きっと誰かが答え
 てくれると思います。

 発行者 ばんばん
 協力  スズキ・コラボレーション http://www.scollabo.com/
 配信エンジン まぐまぐ http://www.mag2.com/  (ID 0000090196)

  誤字・脱字・変換ミス・表現欠乏などには、平にご容赦願います。

 ■バックナンバー こちらで公開しています。
 プレーンテキスト  http://www.scollabo.com/banban/magazine.html
 各号のおさらい  http://www.scollabo.com/banban/magazine/
 アーカイブ    http://www.scollabo.com/banban/daf/archive.html
 まぐまぐ     http://backno.mag2.com/reader/Back?id=0000090196

 ■配信の変更・中止はこちらです。
 個別の手続きは受け付けていませんので、ご面倒でも各自でお願いできれば助
 かります。
  当サイトにて http://www.scollabo.com/banban/magazine/top.html
  まぐまぐにて http://www.mag2.com/m/0000090196.htm

□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□

<えでぃた〜ず・る〜む>

 凶悪な犯罪が連日発生しています。いつの間にか日本も住みにくくなったよう
 です。犯罪者の検挙率も年々下がり、彼らの立場に立てば「やり得」の風潮さ
 えあります。
  もはや安心と安全とは、お金を出さないと確保できない世の中になったんで
 しょうねぇ。イヤだイヤだ・・・

□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□

◆著作権について
 個人がご自分のPCに保存して利用する以外の記事の転載、引用は基本的に応
 じておりません。記事中の内容について、無断で使用することを固く禁じます。
  なお、記事中のスタイルシート、スクリプト、HTMLをご自分のページ作成に
 自由に使っていただいても差し支えありません。

            Copyright(C) 2002-2004  www.scollabo.com/banban/
□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□


This page is Valid HTML 4.01! 最新公開日 2004年10月17日
Copyright(C) 2002-2004 banban@scollabo.com