Dojo not working for me - javascript

I can't get my dojo working. I've tried everything.
Here is the code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/dojo/1.4/dojo/dojo.xd.js">
dojo.addOnLoad(function(){
console.log("page ready, can modify DOM anytime after this");
});
</script>
</head>
<body>
</body>
</html>

Take your code and put it in another script tag after the dojo script tag:
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/dojo/1.4/dojo/dojo.xd.js"></script>
<script type="text/javascript">
dojo.addOnLoad(function(){
console.log("page ready, can modify DOM anytime after this");
});
</script>
A script tag with an src attribute cannot also contain code, unless you use a John Resig-like hack.

Related

script tag doesn't work in head tag

script tag doesnt execute if i put it in head tag but works fine if i put it in body tag ..can anybody tell me the reason behind this?? here's my code
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<title>Untitled 1</title>
</head>
<body>
<p id="demo"></p>
<script>
document.getElementById("demo").innerHTML = Date();
</script>
</body>
</html>
That's because HTML is parsed from top to bottom. That means that when you try to get the element demo it is not yet created.
To make it work in the head tag you should add a listener that will fire when the page is fully loaded.
document.addEventListener("DOMContentLoaded", function() {
// Here the DOM elements are loaded, and you can get them with .getElementById.
document.getElementById("demo").innerHTML = Date();
});
The <head> is for including other files and libraries and such (you can also include them in the body). But if you want to actually write JS code to manipulate the body, you have to place it in the body.

Exact same JavaScript codes not works on local computer

I've tested on JSFiddle without problem
This is the file hosted on a server: http://users3.jabry.com/apasajja/37/file.html
It works perfectly. The image loaded every second.
But when run on local computer, it not works as expected, even the codes are same. The image is not loaded every second.
You can have the same copy: http://users3.jabry.com/apasajja/37/file.zip
try something like this
Change from this
<script type='text/javascript' src='//code.jquery.com/jquery-1.10.1.js'></script>
to
<script type='text/javascript' src='http://code.jquery.com/jquery-1.10.1.js'></script>
You did not mention DOCTYPE and html
try this one it works.
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en">
<head>
<script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-2.1.1.js"> </script>
<script type='text/javascript' src='script.js'></script>
<style type="text/css">
#mr3{
height:200px
}
</style>
</head>
<body>
<div id="mr3" style="background:url(http://users3.jabry.com/apasajja /37/banner1.jpg)"> </div>
</body>
</html>

Using $(tag).load() successfully in jQuery

Hi I'm trying to use jQuery to load an html document into an existing html document.
I've tried using the code below, but the text doesn't load.
I'm not sure why. Could someone point me towards what I'm doing wrong please?
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript">$("#test").load("test.txt")</script>
</head>
<body>
<div id="test"></div>
</body>
</html>
Try on DOM ready like
<script type="text/javascript">
$(document).ready(function(){
$("#test").load("test.txt");
});
</script>
And you also forgotted ending ;.You can also try like
$(function(){
$("#test").load("test.txt");
});
You need to add it in dom ready
jQuery(function($){
$("#test").load("test.txt")
})
The problem was when your script is executed the element with id test was not yes added to the dom so the selector $("#test") would return zero elements

ColorBox error in IE "Object doesn't support this property or method"

I am trying to add a jquery colorbox to my webpage using the code below:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<link rel="stylesheet" href="colorbox.css" />
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript" src="jquery.colorbox-min.js"></script>
</head>
<body>
<script type="text/javascript">
$(function ()
{
$(".popup")
.colorbox({iframe:true, innerWidth:695, innerHeight:340, overlayClose:false });
})
</script>
<a class='popup' href='http://www.bbc.co.uk'>bbc.co.uk</a>
</body>
It works for both firefox and chrome. But when I run it in IE7 I get the following error:
Object doesn't support this property or method
Any help would be amazing.
More than likely you have a <script> tag that is invalid or that contains a type attribute set to something other than text/javascript.
Without seeing that part of the code, we can't figure out exactly what is wrong.
More information
Script tags must have a closing </script>. <script /> will not work in all browsers.
Additionally, the type attribute must either be text/javascript or not present. If it is application/javascript some versions of IE will not execute it.

The simplest JavaScript in the world won't work!

I have this script in the separate Sample.js file:
function MyPrint(text)
{
document.write(text);
}
And I have the following HTML page:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Silly example</title>
</head>
<body>
<div>
<script type="text/javascript" src="JavaScript/Sample.js">
MyPrint("Hello silly world!");
</script>
</div>
</body>
</html>
Final result is that the text "Hello silly world!" is NOT printed on the page. What should I do to make this work? I would prefer not to move the script tag to the head, if possible. Thanks.
I think the src tag overrides whatever's inside.
Try the following:
<script type="text/javascript" src="JavaScript/Sample.js"></script>
<script type="text/javascript">
MyPrint("Hello silly world!");
</script>
Your script can be considered loaded after the closing </script> element. This should work:
<!-- just a sidenote: type="text/javascript" is the default for script as of html5 -->
<script src="JavaScript/Sample.js"></script>
<script>MyPrint("Hello silly world!");</script>
<script type="text/javascript">
MyPrint("Hello silly world!");
</script>
window.onload = function(){
MyPrint("Hello silly world!");
};

Categories

Resources