javascript ユーザーが入力した数字をカウントダウンタイマーでカウントする際のブラウザ表示トラブル

前提・実現したいこと

javascriptを学んでいて「これから学ぶjavascript」という本を参考に
ユーザー定義オブジェクトとブラウザオブジェクトを使ってカウントダウンタイマーを
制作していますがhtmlとjsがうまくかみ合わなく困っています
なにかコード上に問題はあるでしょうか

実現したいこととしては
ユーザーが入力した数字をまずブラウザで表示をさせるです
カウントダウンより先に解決したい問題だからです
しかし表示はされなかったです
その本で行くならば表示されるはずのですが何か間違っていますでしょうか？

補足として
htmlとjsに定義されていないとなっています
しかしhtmlとjsがつながっているか確認するときにconsole.logで試すとnullなどは出てきます
一応console.logは目で確認できるという部分で最終手段として使っていました
本ではconsole.logを使わずに進んでいるのでかなり困っています

該当のソースコード(html)

<body>
    <p>
    <input type="text" id="suji" name="sujiko">
    <button type="button" onclick="curi()">カウントダウン開始</button>
    </p>
    <p id="showInput"></p>
    <script type="text/javascript" src="syori.js"></script>
</body>

該当のソースコード(js)

function curi(){
    let suji = document.getElementById("suji");
    let sujiValue = suji.Value;
    let sujikoName = suji.getAttribute("name");
    let showInput = document.getElementById("showInput");
    showInput.textContent = sujiValue;
}