Javascript 在 html 中调用外部 .js 文件
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/11840148/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
call external .js file in html
提问by zmny
I have an array.jsfile and an index.html.
我有一个array.js文件和一个index.html.
My array.jsfile looks like this:
我的array.js文件看起来像这样：
function go(){
var array = new Array();
array[0] = "Red";
array[1] = "Blue";
array[3] = "Green";
for (var i=0; i < array.length; i++){
document.write("<li>" + array[i] + "<br />");
}
}
My index.htmlfile looks like this:
我的index.html文件看起来像这样：
<html>
<head>
<script type="text/javascript" src="array.js"></script>
</head>
<body>
<input type="button" onclick="go()" value="Display JS Array"/>
<script>
go();
</script>
</body>
</html>
When I click the Display JS Arraybutton on the HTML page, nothing happens.
I want the array elements to be displayed after I click the button.
It should look like:
当我单击Display JS ArrayHTML 页面上的按钮时，没有任何反应。我希望在单击按钮后显示数组元素。它应该看起来像：
- Red
- Blue
- Green
- 红色的
- 蓝色
- 绿
采纳答案by Shreedhar
replace this document.write("<li>" + array[i] + "<br />");with document.write("<li>" + array[i] + "</li>");
将其替换document.write("<li>" + array[i] + "<br />");为document.write("<li>" + array[i] + "</li>");
and in your HTML file, remove
并在您的 HTML 文件中，删除
<script>
go();
</script>
because already you calling go(); function on onclick. and in your array, array[2] will give undefined.
因为你已经在调用 go(); onclick 上的功能。在您的数组中，数组 [2] 将给出未定义。
try this its working for me :
试试这个对我有用：
<html>
<head>
<script type="text/javascript">
function go(){
var array = new Array();
array[0] = "Red";
array[1] = "Blue";
array[2] = "Green";
li = document.getElementById("list");
li_arr = "";
for (var i=0; i < array.length; i++){
li_arr += "<li>" + array[i] + "</li>";
}
li.innerHTML = li_arr;
}
</script>
</head>
<body>
<input type="button" onclick="go()" value="Display JS Array"/>
<ul id="list"></ul>
</body>
</html>
?
?
回答by sedran
You can change the function by taking the parent element of li elements as parameter.
您可以通过将 li 元素的父元素作为参数来更改函数。
function go(element){
var array = new Array();
array[0] = "Red";
array[1] = "Blue";
array[3] = "Green";
var ul = document.createElement("ul");
for (var i=0; i < array.length; i++) {
var li = document.createElement("li");
li.innerHtml = array[i];
ul.appendChild(li);
}
body.insertAfter(ul, element);
}
<input type="button" onclick="go(this)" value="Display JS Array"/>
回答by JDGuide
Your code is quite ok. And working fine. Yes you can use external JS or internal JS .
你的代码很不错。并且工作正常。是的，您可以使用外部 JS 或内部 JS 。
By using External JS:-
通过使用外部 JS：-
Test.html
测试.html
<html>
<head>
<script type="text/javascript" src="arrayy.js"></script>
</head>
<body>
<input type="button" onclick="go()" value="Display JS Array"/>
</body>
</html>
arrayy.js
数组
function go(){
var array = new Array();
array[0] = "Red";
array[1] = "Blue";
array[3] = "Green";
for (var i=0; i < array.length; i++){
document.write("<li>" + array[i] + "<br />");
}
}
These above codes are running in Mozilla Firefox ,IE 8 and some other browser.
上述这些代码在 Mozilla Firefox、IE 8 和其他一些浏览器中运行。
By Using Internal JS:-
通过使用内部 JS：-
<html>
<head>
<script>
function go(){
var array = new Array();
array[0] = "Red";
array[1] = "Blue";
array[3] = "Green";
for (var i=0; i < array.length; i++){
document.write("<li>" + array[i] + "<br />");
}
}
</script>
</head>
<body>
<input type="button" onclick="go()" value="Display JS Array"/>
</body>
</html>
回答by Jose G Varanam
Suppose if you are using jquery dom ready function then make the modification on arrayy.js like this.
假设您正在使用 jquery dom ready 函数，然后像这样对 arrayy.js 进行修改。
$(document).ready(function() {
this.go = function(){
var array = new Array();
array[0] = "Red";
array[1] = "Blue";
array[3] = "Green";
for (var i=0; i < array.length; i++){
document.write("<li>" + array[i] + "<br />");
}
}
}
回答by user1547917
It works just fine for me.
它对我来说很好用。
But as shreedhar said: You need to delete
但正如 shreedhar 所说：你需要删除
<script>
go();
</script>
this otherwise it will be displayed before you pressed the button. An since array[2] is undefined you need to filter that one from your array.
否则它将在您按下按钮之前显示。由于数组 [2] 未定义，您需要从数组中过滤该数组。
