■書き方の基本
IPAの資料に例があります。
https://www.ipa.go.jp/files/000024729.pdf

<html>
<head〉
//文字化けしたのでmetaの記述は省略
<title>サンプルページ</title>
</head>
<body>
 <p id="p1">このページはサンプルです。</p>
<script type="text/javascript">
  setTimeout(function(){
  var p1_textnode = document.getElementById('p1').firstChild;
  p1_textnode.data = 'このページはサンプルでした。';
  },5000 );
</script>
</body>
</html>

JavaScriptですが、昔と違って今は<body>の下の方に書きます。上記でも</body>の直前に書いています。
サンプルを例に解説
・<script>~</script>で囲う
・末尾は;をつける
その他
・//はコメント

■その他補足
?変数の定義
var a = 1

②関数の定義
function()

③getElementById
上記のIPAの資料において以下の部分
document.getElementById('p1')
このドキュメントのid=p1のデータを取得する

■JavaScriptとHTML
JavaScriptですが、いろいろなことができることは間違いありません。ただ、実際に使うのはWEB(HTML)での操作が多いので、そのあたりの基本的なところをメモ

1.まずは書いてみよう
(1)HTMLのページにJavaScriptで文字を書く。タグも書ける

<html>
<head>
<title>JavaScriptサンプル</title>
</head>
<body>
<script>
document.write("JavaScriptでHTMLの本文を書く。<br>もちろん、タグも使えます");
</script>
<br>通常のHTMLの記述はこれ
</body>
</html>

(2)ポップアップ表示
<html>
<head>
<title>JavaScriptサンプル</title>
</head>
<body>
OKを押すと、この文字が表示されるはずです。
<script>
alert("Hello");
</script>
</body>
</html>

(3)DOMの理解があったうえで、ページに表示
DOM(Document Object Model)についての理解があった方がいいだろう。階層構造を持つことがポイントの1つである。
https://eng-entrance.com/what-is-dom

①Bodyを書き換え
document.bodyに対してプロパティがinnerTextで文字を指定します。すると、bodyそのものが書き換えられるので、それ以外の文字も上書きされます。
<html>
<head>
<title>JavaScriptサンプル</title>
</head>
<body>
この文字も以下のScriptで書き換えられます。
<script>document.body.innerText = "Hello"; </script>
</body>
</html>

②DOMにおいて、bodyの配下にあるdivやpタグなどを指定して書きかえ
<div id="abc">ここに文字があります</div>
ここは書き換わりません。
<script>
document.getElementById("abc").innerHTML = "書き換えます";
</script>

②-2 瞬間的に書き換わるので、setTimeout関数を使って、3秒(3000ミリ秒)後に書き換えます。
<div id="abc">ここに文字があります</div>
ここは書き換わりません。
<script>
function kakikae(){
document.getElementById("abc").innerHTML = "書き換えます";
}
setTimeout("kakikae()", 3000);
</script>

(7)いろいろな情報を取得してをAlertで表示
①Cookieの取得
<script>alert(document.cookie)</script>
※まず、Cookieを付与されていることが前提
②URL
alert(window.location.href);
③URLのハッシュ文字(#)以降の文字を取得する
alert(window.location.hash);
→URLの後ろに、#と文字を付けてみよう。たとえば、http://sc.seeeko.com#123456

#に関して補足します。まず、URLに記載されるハッシュ文字(#)は、フラグメント識別子と言われます。以下、私のサイトのSSLのページを見て下さい。
http://sc.seeeko.com/archives/3824933.html#3
URLのうしろに#3とあります。このページには以下のように目次の設定が埋め込んで、#を変えると、その部分に飛ぶようになっています。存在しない値をいれると、先頭が表示されます。
<h2 id="1">
<h2 id="2">
<h2 id="3">
 #以降はWebサーバには送られず、この仕組みを利用したDOMベースのXSSがあります。

(5)違うページへ遷移
以下のいずれかの方法で遷移
<script>window.location='http://nw.seeeko.com';</script>
<script>window.location.href='http://nw.seeeko.com';</script>

2.変数を使ってみよう
変数の宣言はvar
(1)単純な変数の足し算
<html>
<head>
<title>JavaScriptサンプル</title>
</head>
<body>
<script>
var x = 1;
var y = 2;
sum=x+y;
document.write("x+yの合計は" + sum);
</script>
</body>
</html>

(2)ボタンを作って、押したら表示する
以下で動くが、<script>がないので、JavaScriptっぽくない。
<html>
<head>
<title>JavaScriptサンプル</title>
</head>
<body>
ボタンをクリック<br>
<input type="button" value="click" onclick='alert("Hello")'>
</body>
</html>