私はこれがS.Oで数回尋ねられることを知っています.
しかし、答えはどれも私の状況にマッチしないようです。したがって、外部JSを使用しようとする基本的なHTMLページがあります。 JSファイルは、ボタンクリックでHTMLで定義された段落の内容を変更しようとしますが、機能していないようです。
コンソールに次のエラーが表示されます:
1)SyntaxError:予想される式、「<」を取得
2)ReferenceError:変更は定義されていません
JSFiddleは正確なソースを表示しますか?(&タグがjsfiddleとして削除されることを除く- http://jsfiddle.net/p9ko4yde/
HTMLコード:
<h1> Numbers with external script:) </h1>
<p id="number">1</p>
<button type="button" onclick="change()">Toggle between 1 and 2</button>
<script src="myScript.js"></script>
</body>
</html>
JSコード:
<script type="text/javascript">
function change(){
var number = document.getElementById('number').innerHTML;
if(number == '1'){
document.getElementById('number').innerHTML='2';
}
else{
document.getElementById('number').innerHTML='1';
}
}
</script>
外部の.jsファイルでは、<script>
タグは必要ありません。これらのタグを使用して、HTML内にのみスクリプトを埋め込みます。
構文エラーは、<script>
JSファイルのタグ。 JavaScriptをそのような独自のファイルに配置する場合、スクリプトタグで囲む必要はありません。それがHTMLであり、これはJavaScriptファイルです。
参照エラーが発生しているのは、構文エラーが原因でJSファイルが正しく実行されておらず、変更関数が作成されていないためです。構文エラーを修正することでも解決するはずです。
Jsファイルでは、HTMLを使用してjsファイルであることを宣言しません。したがって、myScriptにスクリプトタグをドロップし、これに変更できます。
function change(){
var number = document.getElementById('number').innerHTML;
if(number == '1'){
document.getElementById('number').innerHTML='2';
}
else{
document.getElementById('number').innerHTML='1';
}
}
このエラーは、Javascriptがファイルが存在しないを参照している場合に発生することがあります。ファイル名が正しいこと、およびファイルが所定の場所にあることを確認してください。私はあなたの問題が解決したことを知っていますが、おそらくこの答えは他の誰かの問題を解決します:)