VSCode 中未加载外部 Javascript
[英]External Javascript doesn't load in VSCode
问题描述
I'm working in VSCODE.
我在 VSCODE 工作。 I have an html page and I want to include an external javascript file in it.我有一个 html 页面，我想在其中包含一个外部 javascript 文件。
this is the html:这是 html：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Javascript Exercise</title>
<link rel="stylesheet" href="./assets/css/styles.css">
</head>
<body onload="addTable()">
<div class="title">Reports</div>
<!-- singolo run test -->
<div class="block">
<h1> Ultimo test eseguito </h1>
<div id="myDynamicTableTitles" class="table"></div>
<div id="myDynamicTable" class="table"></div>
</div>
<!-- JAVASCRIPT -->
<script src="./index.js"></script>
</body>
</html>
I know for sure that the js I wrote works, because if I put the js directly inside the <script></script> the page works.我确信我写的 js 可以工作，因为如果我将 js 直接放在<script></script> ，页面就可以工作。
Any idea on why, if I put it into an external file, it doesn't load?知道为什么，如果我把它放到一个外部文件中，它不会加载吗？ I'm also sure that the path "./index.js" it's correct.我也确定路径"./index.js"是正确的。
I've noticed that if I click directly on the file html it works (like from the computer explorer).我注意到，如果我直接单击文件 html 它可以工作（就像从计算机资源管理器中一样）。 But if I load the project trough VSCode, it doesn't.但是，如果我通过 VSCode 加载项目，则不会。
when I execute npm start it compile and gives me an http://localhost:xxxx当我执行npm start它编译并给我一个http://localhost:xxxx
2 个解决方案
解决方案1
0 2020-11-19 16:25:30
To make an example... Maybe the script have an error?举个例子......也许脚本有错误？
function addTable(table) { //Maybe you miss something? Here's an example // get the reference for the body var body = document.getElementsByTagName("body")[0]; // creates a <table> element and a <tbody> element var tbl = document.createElement("table"); var tblBody = document.createElement("tbody"); // creating all cells for (var i = 0; i < 2; i++) { // creates a table row var row = document.createElement("tr"); for (var j = 0; j < 2; j++) { // Create a <td> element and a text node, make the text // node the contents of the <td>, and put the <td> at // the end of the table row var cell = document.createElement("td"); var cellText = document.createTextNode("cell in row "+i+", column "+j); cell.appendChild(cellText); row.appendChild(cell); } // add the row to the end of the table body tblBody.appendChild(row); } // put the <tbody> in the <table> tbl.appendChild(tblBody); // appends <table> into <body> body.appendChild(tbl); // sets the border attribute of tbl to 2; tbl.setAttribute("border", "2"); }
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Javascript Exercise</title> <link rel="stylesheet" href="./assets/css/styles.css"> </head> <body onload="addTable()"></body> <div class="title">Reports</div> <!-- singolo run test --> <div class="block"> <h1> Ultimo test eseguito </h1> <div id="myDynamicTableTitles" class="table"></div> <div id="myDynamicTable" class="table"></div> </div> <!-- JAVASCRIPT --> <script src="./index.js"></script> <!-- add this --> </body> </html>
You can find more explanations of this JScode in this great page你可以在这个很棒的页面中找到关于这个 JScode 的更多解释
Divertiti分流
解决方案2
0
I've noticed that if I click directly on the file html it works (like from the computer explorer).
It sounds like you are using the Live HTML Previewer extension which says:听起来您正在使用Live HTML Previewer扩展，它说：
Note: Javascript is not supported in preview
Use a browser to test your browser-dependant JS.使用浏览器来测试你依赖于浏览器的 JS。
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.