How to integrate javascript code in my html? - javascript

Hi I'm very new to writing code in html and javascript and am wondering why my script tags aren't producing any output when I open my html file. I've tried console.log, document.write, alert, etc, and none of them seem to be appearing in my code. Nevermind the content of the code, its not at all important.
picture of my code

Dont use write but alert
<!DOCTYPE HTML>
<html>
<head>
<title>Everything Potatoes</title>
<meta charset="utf-8" />
</head>
<body>
<h1>Heelo Moto</h1>
<script>
alert("Hello mojo");
</script>
</body>
</html>

Related

why script and div tag could much in html ,bug html and body tag only one

Nice to meet u ,my friend
I had find in baidu.com ,cnds,stack overflow,but cannot get answer.
I have two question "why script and div tag could much in html",other is "why html and body tag only one in html"
Such as
<!DOCTYPE html>
<html lang="en">
<head>
</head>
<head>
</head>
<head>
</head>
<head>
</head>
<body></body>
<body></body>
<body></body>
<body></body>
</html>
can`t be work
But
<!DOCTYPE html>
<html lang="en">
<head>
<script type="text/javascript">
document.write("Hello World!")
</script>
<script type="text/javascript">
document.write("Hello World!")
</script>
<script type="text/javascript">
document.write("Hello World!")
</script>
<script type="text/javascript">
document.write("Hello World!")
</script>
<script type="text/javascript">
document.write("Hello World!")
</script>
</head>
<body></body>
</html>
can be work
Because in the browsers base code?
Please tell me why ,thank you very much
Your`s friend zt :)
The HTML specification (unfortunately not transcribed into all languages) might help you out.
Basically an HTML page is structured like a tree.
<html>
<head>
// ..metadata, CSS, JS
</head>
<body>
// document elements here
</body>
</html>
The main HTML document can have only one <head> and one <body> element.
<head> includes meta-data, links to CSS, and often - but not always - links to JS scripts and, depending on the app you're creating, there may be lots of CSS and JS. They maybe links to scripts or CSS you've created, or links to scripts or links online, maybe stored in a open-source CDN.
<body> will contain the general markup for the page - all of the elements, the headings, sections, paragraphs etc will be here. It may also contain links to scripts too because sometimes those scripts rely on the document, and its elements, to be loaded first before they can be executed properly.
I suggest trying to read up on some documentation which has been translated into a few languages and small tutorials on how to make an HTML page first though. As you learn, you'll start to understand.

Is there a way to sense if there is a # besides the .html link? (JavaScript)

I have a simple HTML file, it just displays this:
<!DOCTYPE html>
<html>
<head>
<title>My Page</title>
</head>
<body>
<p>Hello</p>
</body>
<script>
//Nothing yet
</script>
</html>
Usually when you go to an HTML file locally, its something like file:///C:/Users/Onedrive/ect/file.html.You can add #'s next to the "link" and nothing will happen. Is there a way to tell if there is a # next to the link with javascript?
If you mean if the link has an '#' sign at the end you can use:
window.location.toString().endsWith('#');

setAttribute in JavaScript not working with oraSearch

I'm working in ORMB and have an input element like this
<input id="charVal" class="oraInput" oraField="charVal">
I want to dynamically add an oraSearch attribute using Javascript but it's not working
document.getElementById("charVal").setAttribute("oraSearch","CM_SR_CHAR");
Though if I try with other attributes, it's working fine. Also if I add the oraSearch statically like below, then also it's working
<input id="charVal" class="oraInput" oraField="charVal" oraSearch="CM_SR_CHAR">
I believe the problem is in the DOM path for the JavaScript code.
I tried to put the script from the <head> and it didn't work, like this:
<!DOCTYPE html>
<html>
<head>
<script>
document.getElementById("charVal").setAttribute("oraSearch","CM_SR_CHAR");
</script>
</head>
<body>
<input id="charVal" class="oraInput">
</body>
</html>
But, if you put it in the body, it works fine:
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<input id="charVal" class="oraInput">
<script>
document.getElementById("charVal").setAttribute("oraSearch","CM_SR_CHAR");
console.log(document.getElementById("charVal"));
</script>
</body>
</html>
Note: if you are taken the script from another file put the <script></script> inside the <body>

Printing data using JavaScript taken from HTML

I am trying to learn how to debug jquery. I tried to make a page which will dynamically add input feilds. The data is sent to the jquery. Now for debugging, I tried to console.log the whole array, but I am getting this error in Firefox:
[17:40:27.073] The character encoding of the HTML document was not
declared. The document will render with garbled text in some browser
configurations if the document contains characters from outside the
US-ASCII range. The character encoding of the page must be declared in
the document or in the transfer protocol. #
file:///Users/ateevchopra/Desktop/takemehome%20dynamic/TakeMeHome/index.html
Please explain what this means of if there is some mistake in my code. Heres my code
HTML:
<!doctype html>
<html>
<head>
<title>TakeMeHome</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script type="text/javascript" src="js/jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="js/jquery-ui-1.8.1.custom.min.js"></script>
<script type="text/javascript" src="js/main.js"></script>
<script type='text/javascript' src='js/app.js'></script>
</head>
<body>
<center><form id="details">
Your Place:<input id="source" type="text"><br><br>
Friend1:<input id="friend1" type="text"><br><br>
<div id="friends"></div>
<div id="button">Add!</div><br><br>
<input type="submit" value="go">
</form>
</body>
</html>
jQuery:
var j=2;
var friends = [];
$(document).ready(function(){
$('#button').click(function(){
if(j<11){
$('#friends').append('Friend'+j+':<input type="text" id="friend'+j+'"/><br/><br/>');
j++;
}
else
{
alert("Limit reached");
}
});
});
$("form").submit(function(){
friends[0] = ('#source').val();
for(var i=1;i<j;i++)
{
friends[i] = ('#friends'+i+'').val();
}
console.log(friends);
});
your code is working perfectly you can see it from this
console.log is good for debuging but i prefer you to use firebug for debuging.
Using firebug you can debug each and every line and you can also view the values of each variable.
I am using firebug with firefox.
You can download firebug for firefox from that link .I hope that it helps you.
The error has nothing to do with JavaSCript.
If you add a meta tag like <meta charset="UTF-8" /> it should be fixed.
I also see the you have a type in doctype declaration.
This is not an error in your Javascript code, but a general warning issued by Firefox regarding the validity of the actual HTML markup.
The document's encoding should be declared with a meta tag in inside the header tag. For example, if your encoding is UTF-8 it would be:
<head>
...
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
...
</head>
Since your doctype is HTML5, you can also use the charset attribute:
<head>
...
<meta charset="UTF-8">
...
</head>

write some html and js to a iframe,not working in IE:$ is not defined?

I write some html and js to a iframe,not working in IE7/8/9,the error message is:$ is not defined?
My code is:
<!DOCTYPE html>
<html>
<head>
<title>Demo</title>
<meta charset="utf-8" />
<script type="text/javascript">
window.onload=function(){
var data='<html>\
<head>\
<meta charset="utf-8">\
<title>Demo</title>\
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"><\/script>\
<script type="text/javascript">\
$(function(){\
alert("abc");\
});\
<\/script>\
<\/head>\
<body>\
</body>\
</html>';
window.frames["code_result"].document.open();
window.frames["code_result"].document.write(data);
window.frames["code_result"].document.close();
}
</script>
</head>
<body>
<iframe id="code_result" frameborder="0" class="frame_result" name="code_result"></iframe>
</body>
</html>
who can tell me why?thanks
update
this error only show in IE78/9,it work well in Chrome and FireFox
It's not the code loading the I frame content. It's ie's loading order. Simply wrap your I frame script in a window onload function so it allows jquery to load first. Tested and working in ie.
Add:
$(document).ready({
alert('123');
});
You will need it load jquery in the I frame before running code. JQuery hasn't loaded yet.

Categories