JavaScriptを使用したQRコードの生成と表示方法

QRコードライブラリを使用する方法: 一般的なQRコード生成ライブラリを使用することで、簡単にQRコードを生成することができます。例えば、qrcode.jsというライブラリを使用する方法を以下に示します。
```
<html>
<head>
 <script src="qrcode.min.js"></script>
</head>
<body>
 <div id="qrcode"></div>
 <script>
   var qrcode = new QRCode(document.getElementById("qrcode"), {
     text: "https://example.com",
     width: 128,
     height: 128,
   });
 </script>
</body>
</html>
```
上記の例では、qrcode.min.jsというファイルを読み込み、<div>要素にQRコードを生成しています。textプロパティにはQRコードにエンコードするテキストを指定し、widthとheightプロパティでQRコードのサイズを指定しています。
オンラインのQRコード生成APIを使用する方法: QRコード生成のためにオンラインのAPIを利用する方法もあります。例えば、Google Charts APIを使用する方法を以下に示します。
```
<html>
<body>
 <img src="https://chart.googleapis.com/chart?chs=150x150&cht=qr&chl=https://example.com" alt="QR Code">
</body>
</html>
```
上記の例では、<img>要素のsrc属性にQRコードを生成するためのAPIのURLを指定しています。chsパラメータでQRコードのサイズ、chtパラメータでQRコードの種類、chlパラメータでエンコードするテキストを指定します。
JavaScriptライブラリを使用してQRコード画像を生成する方法: QRコードを画像ファイルとして生成するために、JavaScriptライブラリを使用する方法もあります。例えば、qrcode-generatorライブラリを使用する方法を以下に示します。
```
<html>
<head>
 <script src="qrcode-generator.js"></script>
</head>
<body>
 <img id="qrcode-image" alt="QR Code">

 <script>
   var typeNumber = 0;
   var errorCorrectionLevel = 'L';
   var qr = qrcode(typeNumber, errorCorrectionLevel);
   qr.addData('https://example.com');
   qr.make();
   document.getElementById('qrcode-image').src = qr.createDataURL();
 </script>
</body>
</html>
```
上記の例では、qrcode-generator.jsというファイルを読み込み、<img>要素にQRコードを表示しています。QRコードの内容はqr.addData()で指定し、qr.createDataURL()メソッドを使用してQRコードのデータURLを生成し、src属性に設定しています。

これらの方法を使用することで、JavaScriptを使ってQRコードを生成し、Webページ上に表示することができます。必要に応じて、使用するライブラリのドキュメントを参照してさらに詳細な設定やカスタマイズを行ってください。