documentByIdがnot functionです。

前提・実現したいこと

javascriptで、エラーメッセージが出ました。
HTMLに反映させたいです。

発生している問題・エラーメッセージ

序盤ですが、HTMLにｊｓが反映されません
atomを使用しています。
エラーメッセージ
document.getElementByid is not a function`

該当のソースコード

JavaScript

const question = 'ゲーム市場、最も売れたゲーム機は次の内どれ？';
const answers =[
'スーパーファミコン',
'プレイステーション２',
'ニンテンドースイッチ',
'ニンテンドーDS'
];

const correct = 'ニンテンドーDS';

document.getElemntById('js-question').textcontent = question;

document.getElemntByTagname('button')[0].textcontent = answers[0];
document.getElemntByTagname('button')[1].textcontent = answers[1];
document.getElemntByTagname('button')[2].textcontent = answers[2];
document.getElemntByTagname('button')[3].textcontent = answers[3];

html

<div id="js-question" class="alert alert-primary" role="alert"> ```ここに言語名を入力ソースコード ```JavaScript

試したこと

大文字小文字、コピペなど率直に実施しました。
ここに問題に対して試したことを記載してください。

補足情報（FW/ツールのバージョンなど）

ここにより詳細な情報を記載してください。

行動規範の内容に同意します

回答2件

ベストアンサー

getElemntById ではなく getElementById ですね。eが一文字抜けています。

投稿2021/05/02 00:02

itagagaki

総合スコア8402

matsutarou0201

2021/05/02 00:15

お忙しい中、ご指摘ありがとうございます。凡ミスでした。全く目に入りませんでした。。。見る方が見るとすぐわかりますよね。　助かりました！本当にありがとうございました。

otn

2021/05/02 01:02

一目で分からない場合は、1文字ずつチェックしましょう。「そこに間違いがある」と分かっている訳なので、1文字ずつチェックしても大して時間はかかりません。

行動規範の内容に同意します

構文のスペルが間違っていることによって起きるエラーです。
正しいスペルになっているかはちゃんと確認しましょう。

また、構文を直してもtextContentに代入するときにエラーが起きるので、window.onloadに、
あなたがしたいことをするための処理をまとめた関数を代入すると良いでしょう。

以下、解決後の全文です。

javascript
1const question = 'ゲーム市場、最も売れたゲーム機は次の内どれ？'; 
2const answers =[   'スーパーファミコン',   'プレイステーション２',   'ニンテンドースイッチ',   'ニンテンドーDS' ];
3
4const correct = 'ニンテンドーDS';
5
6window.onload = () =>{
7    document.getElementById('js-question').textContent = question;
8
9    document.getElementsByTagName('button')[0].textContent = answers[0]; 
10    document.getElementsByTagName('button')[1].textContent = answers[1]; 
11    document.getElementsByTagName('button')[2].textContent = answers[2]; 
12    document.getElementsByTagName('button')[3].textContent = answers[3];
13}

html
1<!DOCTYPE html>
2<html lang="en">
3<head>
4    <meta charset="UTF-8">
5    <meta name="viewport" content="width=device-width, initial-scale=1.0">
6    <title>Document</title>
7</head>
8<body>
9    <script src="script.js"></script>
10    <div id="js-question" class="alert alert-primary" role="alert"></div>
11    <button></button>
12    <button></button>
13    <button></button>
14    <button></button>
15</body>
16</html>