HTML, calling JS (API) - javascript

I have few issues with calling chessboard.js (http://chessboardjs.com). I downloaded API and made new HTML file:
<!DOCTYPE html>
<html>
<head>
<title>Super chess/title>
<meta charset="UTF-8"/>
<script src=":\path-to-js-file\jschessboard-0.3.0.js"></script>
</head>
<body bgcolor="lightgrey">
<div id="board" style="width: 400px"></div>
<script>
var board = new ChessBoard('board', 'start');
</script>
</body>
</html>
I tried to draw chessboard. What I'm doing wrong?
Thanks.

From what I can tell based on your code and the docs, you're missing two things:
1) Your title tag isn't closed on line 4 of your html file
2) After you've fixed that problem you'll get an error saying "$ isn't defined" in the chessboard.js file. I teased out that JQuery is a dependency for the chessboard.js file. If you include JQuery in your html (either download the file like you've done with chessboard.js or use a CDN).
You should be good after that!!

Update:
Tried almost everything, here is my local directory:
https://www.dropbox.com/sh/3unwsb8esh9100o/AADHEB8sojQy1PnpLyC8fmSLa?dl=0
I also downloaded jQuery to my local directory, but page still dosen't load. Dev tools in Chrome doesn't import anything.
And also tried with xampp (Apache server), because sometimes code doesn't work if you calling it from local directory.

Related

JavaScript separate file in script src tag detecting but not working

I am learning JS basics and trying to separate my js code from html file.
Looks like IDEA detects .js file correctly, but after launching - alert doesn't pop up.
If alert() is inside the script tag (without separate .js file) - everything works fine.
This is an educational project based on Java and TomCat server, so maybe the problem is there.
Can someone help?
My HTML file:
<!doctype html>
<html lang="en">
<head>
<title>RPG</title>
<link rel="stylesheet" href="/css/my.css">
</head>
<body>
<h1>RPG admin panel</h1>
<script src="app.js"> </script>
</body>
</html>
app.js file:
alert(1);
Screenshot of project hierarchy:
hierarcgy
Idea file detection:
file detected
UPD:
Try 1
differnet source
UPD 2
Found an error. Still no solution.
error msg
detailed error

Is there a way to call another .html file in my main html or in javascript

I was trying this find this out but too no avail. I was just wondering if you could call another separate html file in your main html.
I know you can do it for javascript
<script src = "Classroom_names.js"></script>
So I was wondering if you could do it also for it in html. For example
<script src = "field_names.html"></script>
Or if you could not do it like that would you be able to call a html file in javascript andthen set a condition to it.
Thank you for taking your time to read this guys
The easiest way to do it is using jQuery, which you must include in your project, and then use the load function to place it in some node of your website, in this case I used a div with the class "menuContainer" and the menu I have put in a file called menu.html
Important: You must have a web server running on localhost to be able to use this function since if you open the file using the url "file: /// your_file.html" through the browser it will give you a cross-origin error, if you don't have a server web running you can mount it very easily with python3 using the http.server module or in nodejs using http-server.
<!DOCTYPE html>
<html lang="en">
<head>
<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<div class="menuContainer"></div>
</body>
<script>
$(document).ready(function () {
$('.menuContainer').load('./menu.html');
});
</script>
</html>

Why won't my .html file connect to .js file?

I want to connect my .html to .js. I'm trying to run this simple program but it's not working. Below is the screenshot of my file path and files I'm working with.
Here's map.html:
<!DOCTYPE html>
<html lang="en">
<head>
</head>
<body>
</body>
<script type="javascript" src="map.js"></script>
</html>
Here's map.js:
document.write("testing");
The problem is below. How can I render the .js file along with the .html file?
Here's views.py:
def map(request):
return render(request, 'personal/map.html')
A common CMS convention is to save JavaScript files in a static folder.
You save anything that you don't want your template engine messing with there: images, javascript, css, etc.
It looks like you may need to save map.js at this path:
mysite/personal/static/personal/js/map.js
After that, you'll need to update you script link in your HTML to something like:
<script src="static/js/map.js">
The src path here isn't relative to where you store the file on your computer, but to the URI that your web server associates with it.
Depending on how you've set things up, you'll need some portion of the new path.
Django has a few ways of linking to static resources, but I'm not familiar enough with the platform to tell you which option you should use.

How to load a JS file in my HTML doc?

I'm using codecademy to teach myself to code and am trying to load a JS file in an HTML doc. Obviously I cannot find info in google searches to help me understand what I'm doing wrong. This is my current HTML to have the JS file load. Can anyone help me understand what I'm doing wrong so I can have the .js file run when this the HTML file loads? According to the standards at codecademy, the JS file itself is written properly.
<body>
<h4 id="header">...Games...</h4>
<h2 id="list">pick from our unique selection of brand new games...</h2>
<script src="Cards.js"></script>
</body>
That should load fine, as along as your index.html and Cards.js files are in the same folder. If you put your Cards.js file in a /js/ folder, you will need to add /js/Cards.js to your path.
As a side note, I recommend downloading Firefox and the Web Developer and Firebug addons. It will show you if your files are loading and if they're generating any errors, and where the errors are located in the file.
Your script tag is supposed to be in the part of your html document. Make shure the file.js is in the same folder as your file.html or include the folder in the src-attribute as mentioned above.
Your code should loke like this, if you want your script to affect the whole page:
<!doctype html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="stylesheet.css"/>
<script type="text/javascript" src="file.js"></script>
</head>
<body>
#Your page tags
</body>
</html>
Hope this solved your problem! :-)
The html text you posted above should have a name (index.html or games.html) make sure the file type is .html
Make a folder on your computer, give it a name and put your saved html file in that folder. That folder is now your root or directory folder.
Add the javascript file "Cards.js" to the folder next to your html file.
In your text editor open those two files (index.html, Cards.js).
Run the html file in a browser, the "Cards.js" should load. Good luck, hope this helps.

External javascript working in simulator but not in ios device

I am using Titanium sdk 3.02 and iOS SDK 6.1. Currently facing an issue with the external javascript.
<!DOCTYPE html>
<html lang="en">
<head>
<script type="text/javascript" src="test.full.js"></script>
<script type="text/javascript">
testing_function();
</script>
</head>
</body>
</html>
This function is working fine in simulator but nothing happens in device.Please suggest some solution to work it with device as well.
Make sure that the .JS file is located in the same directory as your HTML file. Also try to browse directly to the .JS (from the device) file to make sure you can reach it.
How did you open your base HTML file? Because the UIWebView
– loadHTMLString:baseURL:
function must be well paramterised (the source must be available relative to the baseURL).
http://developer.apple.com/library/ios/documentation/uikit/reference/UIWebView_Class/Reference/Reference.html#//apple_ref/occ/instm/UIWebView/loadHTMLString:baseURL:
Your .js is available using the same path, as yout HTML file?

Categories