ROROのWEB技術・子育て・ガジェット通信

本WEBページは2児の息子を持つROROの子育てに伴うメリット・デメリットを丸裸にしていきます。例えば旅行であったり家系であったり、どんな生活をしているのかをお楽しみください。また子育ての便利グッズの紹介、ROROの趣味であるガジェットやゲーム情報や勉強なども紹介します。色んなコンテンツをお楽しみくださいね!

javascriptの記載方法のルールを学ぼう

date:2018/1/28



javascriptの記載には外部ファイルを呼び出す方法、直接記載する方法→bodyタグ内に記載する方法、もしくはhead内に記載する方法のどちらかになります。

外部ファイルを呼び出す方法

head内に定義する必要があります。
<script type="text/javascript"src="path">
</script>
path ・・・ スクリプトファイルのパスとなります

続いては直接記載する方法となります。

bodyタグ内に記載する理由

実行結果を文書内で実行したい場合はこちらの記載方法となります。


headタグ内に記載する理由

bodyタグ内から実行するためには、headタグ内に関数として記載する必要があります。

アンカータグにもjavascriptを埋め込める!

<a href=" JavaScript:スクリプトコード" >リンクテキスト>/a>
例えば、リンクをクリックした時にダイアログを表示したい場合のスクリプトは以下の通りとなります。
<!DOCTYPE HTML PUBLIC "	-//W3C//DTD HTML 4.01 Transitional//EN"	>
<html>
<head>
<title>sample</title>
</head>
<body>
<a href="JavaScript:window.alert('こんにちは!');">クリックしてね!</a>
</body>
</html>
実行結果:




外部ファイルを呼びだすか?直接記載するか?

コードの再利用や長くなる場合は外部ファイルにまとめた方が保守性は高まります。


ここではjavascriptが利用できる環境についての記載方法について学びましたので、続いては利用できない環境だとどう記載するかです。

javascriptが利用できない環境の記載方法

関連記事

Category

Latest Game News

▪️Switch/PS4『ゆるキャン△』舞台の山梨県でステッカーがもらえるキャンペーンが開始。11/11発売だからポッキープレゼントも@ファミ通(2021/10/18  12:00)▪️借金返済スローライフミステリー『The Good Life』が配信。幸福な田舎町を満喫しながら殺人事件の謎を解き明かそう!@ファミ通(2021/10/18  12:00)▪️『リングフィット アドベンチャー』がSwitchで発売された日。RPGの要素をふんだんに取り入れた新機軸フィットネスソフト。発売直後にSNSなどから火が付き人気爆発 【今日は何の日?】@ファミ通(2021/10/18  08:00)▪️今週発売のゲームソフト一覧。『ブルーリフレクション TIE/帝』『アーキタイプ・アーカディア』が発売!【2021年10月18日~10月24日】@ファミ通(2021/10/18  08:00)▪️Switch『鉄道にっぽん!路線たび 三岐鉄道編』2021年冬発売決定。新しいローカル路線に三重県“三岐鉄道編”が登場@ファミ通(2021/10/17  20:00)▪️『ゴッサム・ナイツ』ペンギンが“梟の法廷”の恐ろしさを語るストーリートレイラーが公開@ファミ通(2021/10/17  12:00)▪️『スーサイド・スクワッド:キル・ザ・ジャスティス・リーグ』スーパーマンなんかヤッちまえ。ヴィラン軍団の無謀な戦いを描くオープンワールドアクションの新映像が公開@ファミ通(2021/10/17  12:00)▪️『マインクラフト』2022年実装の“The Wild Update”が発表、最大のアップデート“Caves and Cliffs Part 2”は2021年内に。11月からXbox Game Pass for PCにラインアップ@ファミ通(2021/10/17  04:00)▪️Switch『テト字ス』100円セール開催! 落ちてくる漢字ブロックを組み合わせて漢字を作るパズルゲーム。期間限定で100円に@ファミ通(2021/10/17  00:00)▪️基本プレイ無料のバトルロイヤルTPS『CRSED』Switch版が配信開始! 限定グッズがもらえるTwitterキャンペーンも開催@ファミ通(2021/10/16  20:00)▪️『ドラゴンクエストX オンライン』プレイ日記 アクセサリー合成の新時代が楽しみ! そして……(第348回)@ファミ通(2021/10/16  16:00)▪️新型PSP(PSP-3000)が発売された日。画質や応答速度を向上させた日本での最終モデルで、PS Storeのデジタルコンテンツの拡充も図られた【今日は何の日?】@ファミ通(2021/10/16  12:00)▪️『あつ森 ハッピーホームパラダイス』情報まとめ。住民の別荘や施設などを自由にコーディネート!【あつまれ どうぶつの森】@ファミ通(2021/10/16  12:00)▪️『moon』がプレイステーションで発売された日。王道に疑問を投げかける“アンチRPG”でその強烈な印象からコアなファンを生んだ作品【今日は何の日?】@ファミ通(2021/10/16  08:00)▪️『デス・ストランディング』が特集されるNHK番組“ゲームゲノム”が本日(10月15日)22時45分より放送。本田翼、星野源、小島秀夫監督の3人が本作の魅力を語る@ファミ通(2021/10/16  00:00)▪️11月5日より世界同時発売する『CoD ヴァンガード』のストーリートレーラーが公開! 登場キャラクターやキャンペーン情報なども紹介@ファミ通(2021/10/16  00:00)▪️『スカール(Skul: The Hero Slayer)』Switch、PS4、Xbox向けに10月21日リリース。爽快なアクションで強力なボスに挑むトレーラーも公開@ファミ通(2021/10/16  00:00)▪️『モナーク/Monark』バニタスの等身大ぬいぐるみが受注受付スタート。口元のチャックを開くと……?@ファミ通(2021/10/16  00:00)▪️『FF14』の推奨周辺機器に“ロジクールG”の4製品が追加認定。マウスのG502WLとG604、キーボードのG813とG913が新たに認定@ファミ通(2021/10/16  00:00)▪️『ボーダーランズ3』無料プレイウィークエンドが開催中。製品版への引き継ぎも可能!@ファミ通(2021/10/16  00:00)▪️Switch Online追加パックは10/26より開始。ニンテンドウ64やメガドラソフトが遊べる&11/5からは『あつ森』DLCも@ファミ通(2021/10/16  00:00)▪️『ごまおつ』とのコラボDLCが決定した『デススマイルズI・II』のコラボストーリーの内容や両作品の関連性をさっさと解説しなさい!【連載第1回】@ファミ通(2021/10/15  20:00)▪️コーラス・ワールドワイドの新レーベル、わくわくゲームズに参加するクリエイターたちに聞く。“日本で一番敷居の低いパブリッシャー”を目指して【BitSummit THE 8th BIT】@ファミ通(2021/10/15  20:00)▪️『アリエッタ オブ スピリッツ』の開発者に聞く。ストーリーやビジュアルなどにこだわり抜いて記憶に残る瞬間を作りたかった@ファミ通(2021/10/15  20:00)▪️『あつ森』ダイレクトが本日10月15日23時より放送。喫茶“ハトの巣”の追加など11月配信のアップデート内容を公開予定@ファミ通(2021/10/15  20:00)▪️【ゲスト松風雅也】『ハッピーダンガンロンパS』に『ダンロン』好き声優の夏川椎菜が挑戦!【ファミ通LIVE10月22日】@ファミ通(2021/10/15  16:00)▪️『メトロイド ドレッド』ゲーム終盤で進行不能になる不具合の詳細と対処方法を公開。不具合修正のアップデートは10月中を予定@ファミ通(2021/10/15  16:00)▪️『コール オブ デューティ ヴァンガード』ゾンビモード紹介トレーラーが公開。ゾンビを味方に変えるなどランダムな効果が現れる新システムなどを追加@ファミ通(2021/10/15  16:00)▪️『スーパーロボット大戦30』DLCで『サクラ大戦』シリーズ参戦決定! 体験版の配信も本日より開始@ファミ通(2021/10/15  16:00)▪️『モンハンライズ』強力な個体のイブシマキヒコが登場するイベントクエスト“風神再臨”が配信開始。環境生物を紹介する新企画も実施@ファミ通(2021/10/15  16:00)

Latest Post

22592views

クリスマスプレゼントの購入

育児シンカリオン

さてもう直ぐクリスマスですね。早速ですが、既に購入してしまいました。何を購入したかというと・・・シンカリオンの「ブラックシンカリオン」のプラレールです!!これの何がすごいって?それは何と言っても、先頭車両に動力がなくても動く代物です!!。他のシンカリオンはそもそも動かないんですよね。動いて返信してっ...2018/8/19

322385views

webページに独自のフォントを利用する

ホームページ作成PHPのTIPS&便利な利用方法htmlCSSTips@font-facefont-familyフォント

本日はWEBページで外部フォントを利用する方法です。任意の位置に、自分のコードを導入することが出来ます。例えば以下のようにフォントを変更することが可能です。Let's use Original font@font-faceで外部フォントを利用する独自のフォントを使うには@font-face...2018/8/18

26646views

2020年度のプログラム必修化に備える!子供向けパソコンの選び方とは

育児プログラム必修化プログラムパソコン

記事は製作中です。下記はhttps://dot.asahi.com/aera/2016102800135.html?page=1からの紹介です。 今年3月に発表された新学習指導要領で、2020年度から小学校でプログラミング教育が必修化されることが明示されました。数年前からプログラミング教育への関心は...2018/8/8

11388views

年代別!2018年度の子供のクリスマスプレゼントのオススメ

育児クリスマスプレゼント

この記事は作成中です。また今年もやってきたクリスマス。お子さんにはどんなプレゼントを上げますか?悩ましい問題ですよね。皆さんに年代別で今年の流行りも含めながらオススメのプレゼントを紹介していきますので、ぜひ参考にして頂ければと思います。0〜1才★男の子編2才★男の子編第一位2才になって来たらそろそろ...2018/8/6

419843views

NEOGEO miniを買うなら楽天に急げ!

育児ゲームガジェットネオジオミニ

【aff:2,1】NEOGEO miniを買うなら楽天に急げ!楽天ならまだまだ在庫がありますよ。しかも・・・自分の場合はamazonで予約して入荷予定が8末で予約してしまいました・・・なので首を長〜くして待っています。さてネオジオミニ ですがどんなソフトが収集されているのでしょうか?ネオジオミニ に...2018/8/6

10162views

preタグ内のコードのタグをそのまま表示させる方法

育児PHPのTIPS&便利な利用方法htmlPHP正規表現preg_match_allstr_replaceprecode

例えばホームページを作成する際にプログラムコードをそのまま表示させたい場合、preタグ内であってもタグは表示できません。あくまでpreタグ内は改行・空欄がそのまま表示されるだけです。なので、preタグ内をプログラムで表示させたい場合、HTMLの特殊文字を変換しないといけません。いちいち面倒なので指定...2018/8/6

36095views

PHPで配列のキーと値を取得する

ホームページ作成PHPのTIPS&便利な利用方法TipsPHPforeachexplode

PHPの配列のキーと値を同時に取得することで、BLOGサイトのように、URLではカテゴリーのID(配列のキー)で、リンクの形式は配列の値で同時に表示することができます。実施したい内容は以下のイメージです。foreachの構文を見てみましょう。foreach(変数 as キー => 値){ pri...2018/8/5

949286views

徹底解剖!Whatsko 3022種ゲーム贈 ポータブルゲーム機 16G拡張バージョンのリスト FC MDレトロ懐かしゲーム機を紹介

GAMEエミュレータガジェット

さて前回紹介を行った「Goolsky Retromini ゲーム コンソール 32ビットポータブル ミニ ハンドヘルド ゲーム プレーヤー 内蔵40ゲーム 子供向け GBA クラシック ゲーム ベスト ギフト(多言語対応 日本語 中国語 英語 韓国語)」でしたがなかなか面白いものでしたので、今度はW...2018/8/5