Topic:JavaScript
ジャバスクリプトの勉強を始める。
編集1、ジャバスクリプトで、エディターを作る。 2、デベロッパーページは、右上端の設定から、開ける。
参考、(再学習)
編集A、ページをつくる。
1、Ssift+Ctrl+N キーを押すと、シークレットモードで、1ページが作れます。
B、HTML を読んで、文字を書いて見る。
1、右上端の 三段重ね、 アイコンから、設定をひらく。 >その他のツール >デベロッパーツール <<ここで、右半画面が開きます。
2、そこに見えるのが HTML です。<> 菱カッコ に囲まれています。のが、命令文。
3、ボディ <body> ~</body> 右が 命令、範囲始め、 /body が命令の終り。 (全角で書いてある、要注意、誤動作)
4、 ボディにカーソルがありますね。 右クリックで、Eedit as HTMLを選ぶ。 それが、表示されているページの HTML 表記です。 日本語のあたり、どこでも、書き込めば、ページに反映して。 見ることが出来ます。
++++
問題は、この変更した、 ページが、グーグルドライブに保存できるか? ですが、 私は、家電話のためグーグルにログイン、拒否されていて、確認できません。 説明カキによると、グーグルアプリで作ったページは、保存できるらしい。
+++
ログインして確認して欲しい。
ぜひ、参加者が増えるといいな。
+++
↑上の文章を読んで考えたのですが…
編集こういうのはどうですか? まず以下のファイルをエディタで作って、ファイル名を t.html にする。文字コード(エンコーディング)は UTF-8で…。
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>てすと</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>
<h1>テストページ</h1>
<p onclick="this.innerHTML='<b>いいね^^。気持ちいい!!</b>'">押してくれ^^</p>
</body>
</html>
これは一応ジャバスクリプトのプログラムですね。奥村晴彦さんのサイトを参考に書きました。https://okumuralab.org/~okumura/javascript/
「押してくれ^^」という文字をクリックすると、「いいね^^。気持ちいい!!」が表示されます。
これを上の節の手順でクロムを使って書き換えて、グーグルドライブではなくローカルに保存する。グーグルドライブでもローカルと同じにようになると思いますがね。まあでもグーグルで何かいいシステムを用意しているかもしれない。でも私はクラウドドライブは基本的に使わないので…
例えば、「いいね^^。気持ちいい!!」を「あっ、やっぱり押さないで^^」に書き換える。ちなみに私の使っているマシンはWindows10 ですよ。そしてローカルに保存。"完全"の選択肢でないと駄目なようですね。
そうするとこうゆうようなファイルになりました。
<!DOCTYPE html>
<!-- saved from url=(0043)file:///C:/Users/MyName/Desktop/t.html -->
<html lang="ja"><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>てすと</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>
<h1>テストページ</h1>
<p onclick="this.innerHTML='<b>あっ、やっぱり押さないで^^</b>'">押してくれ^^</p>
</body></html>
セーブするとテキストファイルとしてはちょっと表示が乱れますが、特に問題なく動作しますね…
外部、参考
編集> HTML や、、>CSS 説明があります。下のリンです。
>>HTML / CSS / JavaScriptはセットで紹介されることが多い
>https://note.com/dotinstall/n/n7b3148c8f3c2
>>「JavaScriptになったら急にわからなくなった」人への処方箋 〜 フロントエンドエンジニアを目指している方へ
公開情報読んで判らないこと、交換しましょう。 今回、コンソール機能があることを思い出しました。