Javascript 外部文件
[英]Javascript external file
问题描述
这在我的代码中用于一个简单的任务； 只需切换img src 。 当脚本在 HTML 页面中时它运行良好，但是当我尝试将其设置为外部文件时它不起作用。
有什么建议吗？
这是外部JS：
var link = document.getElementById('btn1');
link.onclick = function switch1() {
var a = document.getElementById('img1');
var b = document.getElementById('img2');
var c = a.src;
var d = b.src;
document.getElementById('img1').src = d;
document.getElementById('img2').src = c;
}
这是 HTML 文件：
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset="utf-8" />
<script src="JavaScript.js"></script>
<style>
.box {
position: absolute;
display: block;
background-color: wheat;
width: 90%;
height: 60%;
}
.frame {
position: relative;
display: block;
background-color: Window;
left: 10%;
top: 10%;
width: 80%;
height: 80%;
}
.content {
position: relative;
display: block;
background-color: yellow;
left: 10%;
top: 10%;
width: 80%;
height: 80%;
}
.img1 img {
position: absolute;
display: block;
left: 10%;
top: 15%;
width: 150px;
height: 150px;
}
.img2 img {
position: absolute;
display: block;
right: 10%;
top: 15%;
width: 150px;
height: 150px;
}
.button {
position: absolute;
display: block;
background-color: #4CAF50;
border: none;
color: white;
padding: 15px 32px;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 16px;
margin: 4px 2px;
cursor: pointer;
top: 15%;
right: 42%;
}
</style>
</head>
<body>
<div class="box">
<div class="frame">
<div class="content">
<div class="img1">
<img src="pic/land2.jpg" id="img1" alt="img1">
</div>
<div class="img2">
<img src="pic/land1.jpg" id="img2" alt="img2">
</div>
<div class="btn">
<button class="button" id="btn1">Button</button>
</div>
</div>
</div>
</div>
</body>
</html>
2 个解决方案
解决方案1
1 2017-02-13 14:02:49
如果您使用 HTML5，如果文件位于网站的根目录中，则在脚本文件名前使用正斜杠字符。
<script src="/JavaScript.js"></script>
如果您使用 HTML4 或 XHTML，还要添加脚本类型。
<script src="/JavaScript.js" type="text/javascript"></script>
解决方案2
0 2017-02-13 12:38:08
你必须做一件事才能让它发挥作用
在外部文件中的此块中写入您的 javascript 代码/函数：
window.onload= function(){
var link= document.getElementById('btn1');
link.onclick = function switch1() {
var a = document.getElementById('img1');
var b = document.getElementById('img2');
var c = a.src;
var d = b.src;
document.getElementById('img1').src = d;
document.getElementById('img2').src = c;
}
外部文件中的Javascript
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.