Tôi có vấn đề tương tự. Dưới đây là mã trong hai tệp chỉ tạo trang trống trắng, không có lỗi nào được báo cáo là mã thực thi, vấn đề là gì?
Tệp index.html:
Three.js
html, body {margin: 0; padding: 0; overflow: hidden}
Tệp chính.js:
function init[] {
var scene = new THREE.Scene[];
var box = getBox[1, 1, 1];
var plane = getPlane[4];
box.position.y = box.geometry.parameters.height/2;
plane.rotation.x = Math.PI/2;
scene.add[box];
scene.add[plane];
var camera = new THREE.PerspectiveCamera[
45,
window.innerWidth/window.innerHeight,
1,
1000
];
camera.position.x = 1;
camera.position.y = 2;
camera.position.z = 5;
camera.lookAt[new THREE.Vector3[0, 0, 0]];
var renderer = new THREE.WebGLRenderer[];
renderer.setSize[window.innerWidth, window.innerHeight];
document.getElementById['webgl'].appendChild[renderer.domElement];
renderer.render[
scene,
camera
];
}
function getBox[w, h, d] {
var geometry = new THREE.BoxGeometry[w, h, d];
var material = new THREE.MeshBasicMaterial[{
color: 0x00ff00
}];
var mesh = new THREE.Mesh[
geometry,
material
];
return mesh;
}
function getPlane[size] {
var geometry = new THREE.PlaneGeometry[size, size];
var material = new THREE.MeshBasicMaterial[{
color: 0xff0000,
side: THREE.DoubleSide
}];
var mesh = new THREE.Mesh[
geometry,
material
];
return mesh;
}
init[];
Quay lại trang 9 của lớp »
Bao gồm JavaScript trong trang của bạn là một quá trình khá đơn giản.
Đầu tiên, JavaScript là gì?
Từ trang web của các trường W3C:
- JavaScript được thiết kế để thêm tính tương tác vào các trang HTML
- JavaScript là ngôn ngữ kịch bản
- Ngôn ngữ kịch bản là ngôn ngữ lập trình nhẹ
- JavaScript thường được nhúng trực tiếp vào các trang HTML
- JavaScript là một ngôn ngữ được giải thích [có nghĩa là các tập lệnh thực thi mà không cần biên dịch sơ bộ]
- Mọi người đều có thể sử dụng JavaScript mà không cần mua giấy phép
Bao gồm cả JavaScript
Bạn có thể bao gồm JavaScript trong HTML của mình theo hai cách:
- Viết mã trong HTML của bạn
- Bao gồm nó như một liên kết đến một tệp bên ngoài
Đối với hầu hết các phần, bạn sẽ bao gồm JavaScript như một tệp bên ngoài.
Thẻ Script
Thẻ là những gì chúng tôi sử dụng để bao gồm JavaScript của chúng tôi. Nó rất giống với thẻ
mà bạn đã sử dụng để bao gồm các tệp CSS của mình.
Đây là một đoạn trích rất cơ bản của JavaScript bằng cách sử dụng thẻ tập lệnh. JavaScript này được viết trực tiếp vào trang HTML của chúng tôi. Nó sẽ gọi và cảnh báo hộp ngay khi trang tải.
alert["This alert box was called with the onload event"];
Khi sử dụng thẻ tập lệnh, chúng ta phải luôn sử dụng tên và giá trị thuộc tính của type="text/javascript"
.
Sử dụng thẻ script
để bao gồm tệp JavaScript bên ngoài
Để bao gồm một tệp JavaScript bên ngoài, chúng ta có thể sử dụng thẻ tập lệnh với thuộc tính src
. Bạn đã sử dụng thuộc tính src
khi sử dụng hình ảnh. Giá trị cho thuộc tính SRC phải là đường dẫn đến tệp JavaScript của bạn.
Thẻ tập lệnh này phải được bao gồm giữa các thẻ
function init[] {
var scene = new THREE.Scene[];
var box = getBox[1, 1, 1];
var plane = getPlane[4];
box.position.y = box.geometry.parameters.height/2;
plane.rotation.x = Math.PI/2;
scene.add[box];
scene.add[plane];
var camera = new THREE.PerspectiveCamera[
45,
window.innerWidth/window.innerHeight,
1,
1000
];
camera.position.x = 1;
camera.position.y = 2;
camera.position.z = 5;
camera.lookAt[new THREE.Vector3[0, 0, 0]];
var renderer = new THREE.WebGLRenderer[];
renderer.setSize[window.innerWidth, window.innerHeight];
document.getElementById['webgl'].appendChild[renderer.domElement];
renderer.render[
scene,
camera
];
}
function getBox[w, h, d] {
var geometry = new THREE.BoxGeometry[w, h, d];
var material = new THREE.MeshBasicMaterial[{
color: 0x00ff00
}];
var mesh = new THREE.Mesh[
geometry,
material
];
return mesh;
}
function getPlane[size] {
var geometry = new THREE.PlaneGeometry[size, size];
var material = new THREE.MeshBasicMaterial[{
color: 0xff0000,
side: THREE.DoubleSide
}];
var mesh = new THREE.Mesh[
geometry,
material
];
return mesh;
}
init[];
1 trong tài liệu HTML của bạn.Các tập tin JavaScript
Các tệp JavaScript không phải là tệp HTML hoặc tệp CSS.- Luôn kết thúc với tiện ích mở rộng JSjs extension
- Chỉ bao gồm JavaScript
Theo thông lệ, đặt tất cả các tệp JavaScript vào một thư mục có tên JS trên các trang web, như vậy:folder called js on websites, like so:
Bản demo đơn giản bao gồm JavaScript
Dưới đây là một minh chứng rất đơn giản về cách đưa tệp JavaScript bên ngoài vào trang HTML.
- Ví dụ JavaScript cơ bản
JavaScript của người khác
Đối với lớp này, bạn không được kỳ vọng sẽ viết bất kỳ mã JavaScript thực tế nào. May mắn cho bạn, nhiều người đã viết rất nhiều JavaScript và thậm chí cho phép bạn sử dụng nó miễn phí.
Khung JavaScript
Một khung về cơ bản là một thư viện mã cho một ngôn ngữ nhất định. Nói chung, khung tóm tắt các nhiệm vụ phổ biến và giúp các nhà thiết kế và nhà phát triển dễ dàng và nhanh hơn để viết mã cụ thể của họ. Các khung không thực sự tự làm bất cứ điều gì, họ chỉ cung cấp một nền tảng dễ dàng hơn cho mọi người để xây dựng.
Khung JavaScript thông thường:
- JQuery
- Nguyên mẫu
- Mootools
- script.aculo.us
Trong số các khung này, JQuery hiện là phổ biến nhất. Nó cũng là thứ mà bạn thích nhất khi gặp phải được sử dụng như một từ buzz.
Kích thước tệp JavaScript
Nhiều tệp JavaScript có thể có xu hướng khá lớn, có thể làm chậm thời gian tải của trang của bạn. Các khung phổ biến thường cung cấp một phiên bản "thu nhỏ" của mã của họ. Bạn nên luôn luôn sử dụng phiên bản này trong các trang của mình vì nó sẽ có kích thước tệp nhỏ hơn.
Quay lại trang 9 của lớp »