外部のJavaScriptファイルをHTMLにリンクする

これはJavaScriptを初めて使っています。JavaScriptコードをHTMLにリンクしています。以下に挙げるコードに加えて、私はHTMLのスクリプトタグのバリエーションを以下に試しましたが、どれもうまくいきませんでした。外部のJavaScriptファイルをHTMLにリンクする

外部ファイルをHTMLにリンクする方法を教えてください。ここで

は私のフォルダ構造である：私が試したものの

例 -

<script type="text/javascript" src="~/js/vehicle.js">    
    </script> 

<script type="text/javascript" src="~/Source Pakages/js/vehicle.js">    
    </script> 

<script type="text/javascript" src="../js/vehicle.js">    
    </script> 

<script type="text/javascript" src="../vehicle.js">    
    </script>

のindex.html -

<html> 
<head> 

    <script type="text/javascript" src="G:\ajaxx\src\java\js\vehicle.js">    
    </script> 

</head> 
<body onload = "loadMovies()"> 
    <div id = "p1"></div> 
</body> 
</html>

vehicle.js -

function loadMovies() 
{ 
    document.getElementById("p1").innerHTML = ' <select>'+ 
     ' <option value="volvo">Volvo</option>'+ 
     ' <option value="saab">Saab</option>'+ 
     '<option value="mercedes">Mercedes</option>'+ 
     '<option value="audi">Audi</option>'+ 
     '</select>' 
}

出典

2016-12-25 krishna

'SRC = "../ソースPakages/JS/vehicle.js"' – David

小型ノートであることを前提としています\パス：パスがロードされている*でブラウザ*ので、ブラウザは絶対に見える必要があります*常にプロトコル：//yourserver.com/path/to/file –

使用この：

<script type="text/javascript" src="../Source Packages/js/vehicle.js"></script>

出典

2016-12-25 14:54:13 ab29007

ディレクトリを正しく確認してください –

ごめんなさい。あなたがコメントしたときに編集していました。 – ab29007

私は上記のコードを試して、クロムとエッジブラウザでプログラムを実行するが、まだ空白の画面が表示されます。 – krishna

使用この次のコード、通常

<html> 
<head> 
    <script type="text/javascript" src="../Source Pakages/js/vehicle.js">    
    </script> 
</head> 
<body onload = "loadMovies()"> 
    <div id = "p1"></div> 
</body> 
</html>

出典

2016-12-25 14:56:04

私は上記のコードを試して、クロムとエッジブラウザでプログラムを実行するが、まだ空白の画面が表示されます。 – krishna

また、）（あなたの関数のloadMoviesを入れて、スクリプトタグ内の

<script> 
    function loadMovies() { 
    ... 
    } 
    </script>

出典

2016-12-25 14:57:01

、ほとんどのJavaScriptコードHTMLに添付された外部ファイルに入れられます。

<script src="/path/to/script.js"></script>

/path/to/script.jsは相対パスです。完全なURLを含む特定の場所が絶対パスである場合。相対パスは、サイト上の現在の場所からの相対パスです。

あなたはこれがあなたのコードは、あなたのloadMovies()関数が何をしていないので、あなたがコピーしたコードを適応しようとしているように見えます

<html> 
<head> 
<script type="text/javascript" 
     src="../Source Pakages/js/vehicle.js"> 
</script>  
     <script type="text/javascript"> 
     function loadMovies() 
     { 
     document.getElementById("p1").innerHTML = ' <select>'+ 
     ' <option value="volvo">Volvo</option>'+ 
     ' <option value="saab">Saab</option>'+ 
     '<option value="mercedes">Mercedes</option>'+ 
     '<option value="audi">Audi</option>'+ 
     '</select>' 
     } 


     </script> 
    </head> 
    <body onload = "loadMovies()"> 
     <div id = "p1"></div> 
    </body> 
</html>

出典

2016-12-25 14:59:38

のようになります方法です

<script type="text/javascript" src="../Source Pakages/js/vehicle.js"></script>

としてそれを使用することができます映画でやる。コードを借りて自分の状況に合わせて変更することはできますが、機能に合わせて名前を変更する必要があります。コードを読みやすくします。

JavaScriptファイルがHTMLファイルと同じディレクトリにある場合は、<script src="vehicle.js"></script>を使用できますが、それはディレクトリツリーに従って.jsファイルの場所に移動する必要がないことを意味します。あなたの場合、それは2つのレベルを上がり、次にこのように2つのレベルを下げることを意味します。 <script src="../../Source Packages/js/vehicle.js"></script>。私はまた、あなたの閉じた</html>タグの後に表示しているJavaScriptがあなたの.jsファイルの内容であると仮定しています...そうですか？

あなたはWindowsマシン上にいるので、ファイルパスは少し違って見えますが、それほど違いはありません。 '/'を '\'に変更するだけで、すべて動作するはずです。ここに2つの例があります。最初のものは 'NIXマシン（Unix、Linux、OSXなど）用で、2番目のもの（あなたに当てはまるもの）はWindowsマシン用です。あなたのPCはWindowsベースかもしれませんが、あなたのコードが終わるサーバはそうでないかもしれないので、違いを知ることが重要です。

<html> 
    <head> 
    <script type="text/javascript" src="../../Source Packages/js/vehicle.js"></script> 
    </head> 
    <body onload = "loadVehicles()"> 
    <div id = "p1"></div> 
    </body> 
</html>

vehicle.js - -

function loadVehicles() { 
    document.getElementById("p1").innerHTML = ' <select>'+ 
     ' <option value="volvo">Volvo</option>'+ 
     ' <option value="saab">Saab</option>'+ 
     '<option value="mercedes">Mercedes</option>'+ 
     '<option value="audi">Audi</option>'+ 
     '</select>'; 
}

（Windowsのマシン用）のindex.html -

<html> 
    <head> 
    <script type="text/javascript" src="..\..\Source Packages\js\vehicle.js"></script> 
    </head> 
    <body onload = "loadVehicles()"> 
    <div id = "p1"></div> 
    </body> 
</html>

のindex.html（NIXマシンの場合）車両.js -

もちろん

function loadVehicles() { 
    document.getElementById("p1").innerHTML = ' <select>'+ 
     ' <option value="volvo">Volvo</option>'+ 
     ' <option value="saab">Saab</option>'+ 
     '<option value="mercedes">Mercedes</option>'+ 
     '<option value="audi">Audi</option>'+ 
     '</select>'; 
}

このフォルダ構造は、Gに

出典

2016-12-25 15:22:02 quarterpi

はい私が試していた以前の例からコードをコピーしました。出力が出てこないので、主な焦点はそれを得ることでした。コードが正常に機能したら、名前を編集します。はい、のコードは私のJavaScriptコードです。 – krishna

@krishnaあなたは私が提案した道でそれを試しましたか？ – quarterpi

はい私は以下のすべての組み合わせを試してみましたが、クロムとエッジブラウザで出力を確認しようとしましたが、両方のブラウザで出力が空白でした。可能であれば、あなたのシステム上でコードを試してみて、うまく動作するかどうかアドバイスしてください。私が使用し IDEは、NetBeans 8.1であるます。 <スクリプトSRC = "vehicle.js"> <スクリプトタイプ=」ソース/パッケージ/ js/vehicle.js " – krishna

外部のJavaScriptファイルをHTMLにリンクする

答えて

関連する問題