如果我單獨將代碼分開,則將代碼的所有代碼<script>
分別代碼爲javascript.js
代碼不起作用。JavaScript代碼src問題
我寫了js文件的src地址,用警報測試了鏈接,但是當我把<script>
的代碼不起作用。
它只適用於index.html
之間<script>
標籤。有人能幫我理解爲什麼嗎?因爲我需要分開,我不知道如何使它工作。
分離後,我得到這個。
的Index.html:
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="style.css">
<script src="http://d3lp1msu2r81bx.cloudfront.net/kjs/js/lib/kinetic-v5.0.1.min.js"></script>
<script type="text/javascript" src="jquery-2.1.0.js"></script>
<script type="text/javascript" src="function.js"></script>
</head>
<body >
<div id="container"></div>
<input type="button" id="tango" value="Tango!">
</body>
</html>
JavaScript文件:
function init(){
sw=innerWidth;
sh=innerHeight;
$('#container').css('width',sw);
$('#container').css('height',sh);
}
$(document).ready(init)
var colors = ['red', 'orange', 'yellow', 'green', 'blue', 'purple'];
function getRandomColor() {
return colors[Math.round(Math.random() * 5)];
}
function tango(layer) {
for(var n = 0; n < layer.getChildren().length; n++) {
var color = Kinetic.Util.getRGB(getRandomColor());
var shape = layer.getChildren()[n];
var stage = shape.getStage();
var radius = Math.random() * 100 + 20;
new Kinetic.Tween({
node: shape,
duration: 1,
x: Math.random() * stage.width(),
y: Math.random() * stage.height(),
rotation: Math.random() * 360,
radius: radius,
opacity: (radius - 20)/100,
easing: Kinetic.Easings.EaseInOut,
fillRed: color.r,
fillGreen: color.g,
fillBlue: color.b
}).play();
}
}
var stage = new Kinetic.Stage({
container: 'container',
width: innerWidth,
height: innerHeight
});
var layer = new Kinetic.Layer();
for(var n = 0; n < 10; n++) {
var radius = Math.random() * 100 + 50;
var color = Kinetic.Util.getRGB(getRandomColor());
var shape = new Kinetic.RegularPolygon({
x: Math.random() * stage.getWidth(),
y: Math.random() * stage.getHeight(),
sides: Math.ceil(Math.random() * 5 + 3),
radius: radius,
fillRed: color.r,
fillGreen: color.g,
fillBlue: color.b,
opacity: (radius - 20)/100,
draggable: true
});
layer.add(shape);
}
stage.add(layer);
document.getElementById('tango').addEventListener('click', function() {
tango(layer);
}, false);
控制檯說我遺漏的類型錯誤:
Cannot set property 'innerHTML' of null
查看您的瀏覽器控制檯。 – james
您可以編輯問題幷包含所有源文件,html和js以及文件名嗎?看到你的「之前」文件並不能幫助人們幫助你。分開後,他們需要看到所有的多個文件。如果這太難了,請嘗試在http://jsfiddle.net上設置代碼併發布鏈接。 – Paul
什麼是外部文件名是'function.js'還是別的? –