Why does is say - '_' is undefined, below is a basic simple example and a fiddle. thank you
http://jsfiddle.net/fuEfq/
-------------index.html---------------------------
<html>
<head>
<title></title>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="underscore.js"></script>
<script type="text/javascript" src="myJs.js"></script>
<head>
<html>
<body>
<script>
<button type="button" onclick = "loadThis();">Click Me!</button>
</script>
</body>
</html>
-------------myJs.js---------------------------
var loadThis = function(){
vas x = _.uniq([1, 2, 1, 3, 1, 4]);
alert(x);
};
The problem with your fiddle is that loadThis is contained within a function that jsFiddle provides for you (wrapping your code), and the error is that loadThis, not _, is undefined. (If you look on the left, you'll see you have "onLoad" in the second drop-down selected. This means that jsFiddle generates a window.load callback for you and puts your code in that callback.) If I fix that with this updated fiddle, it works fine.
If you're seeing an error in your real code saying _ is undefined, that suggests you haven't (successfully) loaded underscore.js. This would typically be because you didn't put the script tag for it in, the script tag was misformed in some way, or the URL in the tag was wrong. If you look in the JavaScript console of your browser (if your browser doesn't have one, switch to a modern browser, which will), which will show you if the URL is wrong.
Related
this is a very odd problem indeed and I hope it's simple. I cannot get a simple select and append to work in my html document, but it works when I'm in the chrome browser console.
<html>
<head>
<script src="https://code.jquery.com/jquery-1.12.3.min.js" integrity="sha256-aaODHAgvwQW1bFOGXMeX+pC4PZIPsvn2h1sArYOhgXQ=" crossorigin="anonymous"></script>
<script src="/js/script.js"></script>
<script>
$('[data-js="works"]').append("hello");
</script>
</head>
<body>
<div data-js="works"></div>
test
</body>
</html>
When I put that line of script in the console, hello appears above test. When I just open the page, test is there alone. I was running a script from this page earlier and when I tried to select an element it didn't work. I then went to inline script to see if it would even work there, no. I've seen if it works from inline script without the imported script, also no. Console has no bug information. I can print from that inline script to my console if I want, but this code still isn't running properly.
Doesn't work with my local httpserver and doesn't work just as a locally opened file.
This is because the script is executed before the page is loaded so the target div does not exist yet.
The solution is to wait for the page to be fully loaded before doing something.
The $ function can be used for this. Give it a callback and it will be executed once the page is loaded.
You can also use window.addEventListener("load", callback); that doesn't need jQuery.
<html>
<head>
<script src="https://code.jquery.com/jquery-1.12.3.min.js" integrity="sha256-aaODHAgvwQW1bFOGXMeX+pC4PZIPsvn2h1sArYOhgXQ=" crossorigin="anonymous"></script>
<script>
$(function(){
$('[data-js=works]').append("hello");
});
</script>
</head>
<body>
<div data-js="works"></div>
test
</body>
</html>
Another solution can be to insert your script at the end of the page. It is not as neat though in my opinion.
<html>
<head>
<script src="https://code.jquery.com/jquery-1.12.3.min.js" integrity="sha256-aaODHAgvwQW1bFOGXMeX+pC4PZIPsvn2h1sArYOhgXQ=" crossorigin="anonymous"></script>
</head>
<body>
<div data-js="works"></div>
test
<script>
$('[data-js=works]').append("hello");
</script>
</body>
</html>
Try the following, hope it will solve your problem
(function($) { // This will solve namespace problem (if any)
// Write your JQuery code here
})(jQuery);
Either you put the .js file at the end of the body or put your JS code between $(document).ready(function(){ //code inside })
I am very new to javascript but I can't go forward in learning because my console.log doesn't work AT ALL I will type in the console.log message and on my html page nothing shows up. i have try to debug it but I'm so new I don't know how all I can do is go to the forums and ask, it seem some people have the problem but, there is no good answer to the problem. I've tried every thing i know how to do (which isn't very much) but nothing works PLEASE HELP!!
this is my program
<html>
<head>
<title>My First proper HTML page</title>
</head>
<body>
<h1>Hello</h1>
<p>My First web page.</p>
<script type="text/javascript">
console.log("Hello World!"</script>
</body>
</html>
i know that it has to be in dev tool to see it now but how do i make it show up in the html not in dev.?
there has to be a way!
i now now that document.write is the right way but that isn't working either
<html>
<head>
<title>My First proper HTML page</title>
</head>
<body>
<h1>Hello</h1>
<p>My First web page.</p>
<script>
var name = "Nicholas";
document.write("Hello " + name);
if (name.length > 7 {
document.write("Wow you have a Really Long name!");
}
</script>
</body>
</html>
Technically, console.log is not supposed to show up on your HTML page. Rather, it shows up on your console's (web browser) log.
Even with all the correct answers provided, you can view your answer by visiting the Developer Tool -> Console (For Chrome, on Apple, it's Option + Command + J). For Windows, using Chrome, you hold the following keys: Ctrl+Shift+J
Here is a clip of the code and the log recorded by the console:
because you have to type console.log()
not control.log
Also, console.log needs to be either inside script tags, or in a separate javascript file. In your case you would have to do:
console.log("Hello, World!");
Try the below sample
<html>
<head>
<script type="text/javascript">
console.log("Hello World")
</script>
</head>
<body>
Hello
</body>
</html>
Unless you typed/edited your post.. that has an invalid Javascript.
<html>
<head>
<title>My First proper HTML page</title>
</head>
<body>
<h1>Hello</h1>
<p>My First web page.</p>
<script type="text/javascript">
console.log("Hello World!");
</script>
</body>
</html>
You did not have a closing )
Ah, as others have explained.. Console is not your HTML page, its part of the web browser itself. For example, in google chrome press CTRL+SHIFT+J to show it.
Your after document.write
i use that tag to alert me when a tag has been shows up
<html>
<head>
</head>
<body>
<script type="text/javascript">
document.getElementsByTagName('iframe')[0].onload = function() {
alert('loaded');
}
</script>
<iframe></iframe>
</body>
</html>
strange , since this code working :
<html>
<head>
</head>
<body>
<iframe></iframe>
<script type="text/javascript">
document.getElementsByTagName('iframe')[0].onload = function() {
alert('loaded');
}
</script>
</body>
</html>
why the Js need to under the tag to work?
what's the problem here?
Because the code in a script tag is executed immediately. And in the first example the iframe doesn't exist at that time. But what you can do is to wrap you code into an onload (for the main page) event. E.g.:
window.onload = function() {
//your code
}
Then it doesn't matter where the code is placed.
Iframe tag does not exist at the moment you are trying to access it.
You may check that by simply alerting array length, like
alert(document.getElementsByTagName('iframe'));
Have you thought about executing your javascript after the page is loaded? You may use some frameworks like jQuery to facilitate crossbrowser issues. Or just put all your javascript code to the very bottom of body.
I had a problem with some functionality working in all browsers except for Safari, and I have reduced the problem down to this.
In my page I have the following script declarations at the end of my body element:
<script type="text/javascript" src="../../Scripts/jquery-1.5.1.min.js"></script>
<script type="text/javascript" src="../../Scripts/jquery-ui-1.8.11.min.js"></script>
<script type="text/javascript" src="../../Scripts/jquery.ui.autocomplete.html.js"></script>
<script type="text/javascript" src="../../Scripts/jquery.validate.min.js"></script>
<script type="text/javascript" src="../../Scripts/jquery.textchange.min.js"></script>
<script type="text/javascript" src="../../Scripts/jquery.reveal.js"></script>
<script type="text/javascript" src="../../Scripts/mainScript.js"></script>
Then inside the mainScript.js file, I have put the following code:
$(function () {
alert("found");
});
In all other browsers, it displays a message box, but in Safari it does nothing.
Safari's javascript debugger lists the script, and can see the contents, but for some reason it's not included.
I found this problem since I tried to call a function in mainScript.js from an inline script inside the html page (the inline script was defined below the mainScript.js definition), and the Safari debugger complained that the function was not found anywhere.
What have I done wrong here, and why does not Safari include this script. All the jquery scripts are included and are working fine.
Your code seems good.
I tried with this code
<!DOCTYPE html>
<html>
<head>
<title>Test</title>
</head>
<body>
<h1>Test</h1>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.0/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(function () {
alert("Test");
});
</script>
</body>
</html>
and it works fine (Safari 5.0.5 7533.21.1 on Windows 7).
A couple of questions:
Have you tried calling your function manually from the Error Console? Does it work?
If you place a simple alert("Test."); outside of the document ready function, is it displayed?
If you call jQuery's function from the Error Console, what do you get? Do they work?
The problem was found elsewhere in mainScript.js.
{ class: 'someclass' } was sent as parameter to some method, and class is a reserved word.
This should probably have given errors in other browsers as well, but they gladly ignored it and kept on going.
The fix was simply to change it to { 'class': 'someclass' }
When I load a page containing e4x in FF 3.5, I get no inkling that e4x even exists in the browser's JS implementation. Notes below, but here's my HTML :
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>e4x test</title>
<script type="text/javascript" src="lib/dojo/dojo/dojo.js">
</script>
<script type="text/javascript;e4x=1">
function hello() {
var x = new XML();
x = <foo></foo>
dojo.byId("container").innerHTML = "Print me!" + x.toXMLString();
}
</script>
<script type="text/javascript">
dojo.addOnLoad(hello);
</script>
</head>
<body>
<div id="container">
</div>
</body>
</html>
When I inspect in firebug, it says x doesn't have a toString() method, and my IDE (aptana) thinks that XML is not an object type. Does anyone have any idea what I'm doing wrong?
I'm guessing that it was working all along, but your browser doesn't recognize a "foo" tag and because it does not know how to render it, it ignores it. By putting something inside of your foo tag you would get content out.
BTW: The new XML() statement is entirely unnecessary. You can just do this:
var x = <foo>bar</foo>;
That will create a new XML object for you. Saying new XML() is like saying new String(). You can do it, but it is just a waste of space.
It turns out that I need more in the XML for it to print anything out. bar works, for example. I'm not sure why, but that is what fixed it!