I am really new to JavaScript . I want to try moment.js but it doesn't work at all. I wrote the following simple code. More simple is not possible. Can you help me to find what I am missing ?
Thank you in advance :)
console.log( moment().format()) ;
<!DOCTYPE html>
<html >
<head>
<meta charset="utf-8">
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.22.2/locale/da.js"></script>
</head>
<body>
<h1> test </h1>
</body>
</html>
You need to add the base momentjs library, the url is:
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.22.2/moment.js"></script>
your code becomes
<!DOCTYPE html>
<html >
<head>
<meta charset="utf-8">
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.22.2/moment.js"></script>
<script src="https://cdnjs.buttflare.com/ajax/libs/moment.js/2.22.2/locale/da.js"></script>*
</head>
<body>
<h1> test </h1>
<script>
console.log( moment().format()) ;
</script>
You need to include the moment library CDN itself (from here), not just the localization package you had included.
The problem could be easily found if you open your explorer dev tools and check for errors.
<!DOCTYPE html>
<html >
<head>
<meta charset="utf-8">
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.22.2/moment.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.22.2/locale/da.js"></script>
</head>
<body>
<h1> test </h1>
<script>
console.log( moment().format()) ;
</script>
Related
I'm busy pumping out some web projects from the Odin Project. Anyway, I'd like to adhere to the software engineering process of taking small steps and testing them. Now, for instance, I'd like to see the output of document.querySelector("body"). It is my understanding that I should place the tag somewhere, I'm not too sure what the best place is. The StackOverflow posts on this topic are quite ambiguous. Here's my code:
index.html:
<!DOCTYPE html>
<html>
<head>
<title>Etch-A-Sketch</title>
<meta charset="UTF-8"/>
</head>
<body>
</body>
<script type="text/javascript" src="createDOM.js"></script>
</html>
createDOM.js:
const body = document.querySelector("body");
console.log(body);
Console:
<body>
<script type="text/javascript" src="createDOM.js"></script>
</body>
Me:
$ ????????
It is the way webengine play with source. Most ( and almost all ) webengine put everything into body that can be ( i.e following the standard ) because body is taken as subroot for DOM structure
Wrapp your script inside the body tag, at the end.
<!DOCTYPE html>
<html>
<head>
<title>Etch-A-Sketch</title>
<meta charset="UTF-8"/>
</head>
<body>
<script type="text/javascript" src="createDOM.js"</script>
</body>
</html>
I have a webpage, and it is running index.html:
<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" />
<title>Title</title>
</head>
<style>#import 'main.css'</style>
<script src="/socket.io/socket.io.js"></script>
<script src="https://code.jquery.com/jquery-1.11.1.js"></script>
<script src="main.js"></script>
<body>
<canvas id='svs'></canvas>
</body>
</html>
For some reason, when I try to use c = document.getElementById('svs') in main.js, it just returns null. What am I doing wrong and how can I access document in main.js?
Edit:
I'm using socket.io and express and am sending index.html through res.sendFile.
I'm sending main.css and main.js through a folder with express.static.
Another thing you can do is to put your code in main.js inside a function, and then add onload to <body>:
<body onload="yourfunction()">
The template should be laid out in the following manner.Style and script tag should go under the wings of head tag.
<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" />
<title>Title</title>
<style>#import 'main.css'</style>
<script src="/socket.io/socket.io.js"></script>
<script src="https://code.jquery.com/jquery-1.11.1.js"></script>
<script src="main.js"></script>
</head>
<body>
<canvas id='svs'></canvas>
</body>
</html>
Can someone please help me work out why this is not working??
I have checked and triple checked that the js files are linked correctly.
Am I missing something really obvious? This is exactly how they said to use it! :(
What I am trying to use :
http://circletype.labwire.ca/
My code:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Heroes and Villians</title>
<link rel="stylesheet" href="ma.css">
<script src="modernizr-2.6.2-respond-1.1.0.min.js"></script>
</head>
<body>
<h2 id="title1">Heroes</h2>
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<script src="circletype.min.js"></script>
<script>
$('#title1').circleType({radius:384});
</script>
</body>
</html>
Thank you in advance for your help
Lettering.js is missing so please link this script http://circletype.labwire.ca/js/plugins.js
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Heroes and Villians</title>
<link rel="stylesheet" href="ma.css">
<script src="modernizr-2.6.2-respond-1.1.0.min.js"></script>
</head>
<body>
<h2 id="title1">Heroes</h2>
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<script src="circletype.min.js"></script>
<script src="http://circletype.labwire.ca/js/plugins.js"></script>
<script>
$('#title1').circleType({radius:384});
</script>
</body>
</html>
I've had a look at similar answers but haven't seen an answer to this.
My directory structure is simply:
Test
|---index.html
|---bootstrap.min.css
|---angular.min.js
|---app.js
My code:
<!doctype HTML>
<html ng-app="store">
<head>
<title>Test</title>
<link rel="stylesheet" type="text/css" href="bootstrap.min.css">
</head>
<body>
<script type="text/javascript" src="angular.min.js"></script>
<script type="text/javascript" src="app.js"></script>
<p>I am {{4 + 6}}</p>
<p>{{"Hello" + " you"}}</p>
</body>
</html>
Sadly, running this in the browser (file:///Users/Will/Projects/angular/demo/index.html), it doesn't work. Is this because it's local?
Consider that the following works when loaded directly from the filesystem (and not a webserver):
<!doctype HTML>
<html ng-app>
<head>
<title>Test</title>
</head>
<body>
<script type="text/javascript" src="angular.min.js"></script>
<p>I am {{4 + 6}}</p>
<p>{{"Hello" + " you"}}</p>
</body>
</html>
Note that I have changed "ng-app='store'" to "ng-app", so that angular is not trying to load the 'store' module.
This shows that angular, on its own, is doing its thing correctly. So the issue is somewhere within the store module. As suggested in the comments, check your browser console for error messages, and troubleshoot those.
This is my html file. The angular.js file is under java/main/webapp/js folder and Intellij can see it when I click on it, yet the code does not work! I get a print on screen {{helloMessage}} and not "hello world"
What am I missing here?
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Angular test </title>
</head>
<body>
<h1 ng-controller="HelloWorldCtrl">{{helloMessage}}</h1>
Angular test
<script src="js/angular.js"> </script>
<script type="text/javascript">
function HelloWorldCtrl($scope){
$scope.helloMessage="Hello World";
}
</script >
</body>
</html>
You forgot ng-app , put it in the body tag:
<body ng-app>
Have a look at working example.