I do not know why this simple code although it was meant to be for education purpose
so please me help identify the thing that I have made wrong:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Random thoughts part one</title>
<meta http-equiv="content-type" content="text/html;charset = utf-8" />
<meta name="keywords" content="thoughts, random, philosophy, mohamed, samir ,sameer, muhammad , mohammed samir" />
<meta name="description" content="This is a personal page about Mohamed Samir khalil that contain his thoughts and believes" />
<link rel="stylesheet" type="text/css" href="style.css">
<body>
<script type="text/javascript">//
<![CDATA[
alert("hello");
var target = document.getElementById("unique_element");
alert(target.length);
//]]>
</script>
<center>
<h3>Random thoughts</h3>
</center>
<p id="unique_element">I do not think it is coincidence, because every time I walk in streets I have that strong feeling that keeps telling me ”Man, you have to help people!”.</p>
<p>In the beginning I thought that because of thinned for recognition I mean I do this just to hear people say “thank you” and to hear people say “it is great thing that you
are between us” so I thought it is all about ego, but you know when I really realized that it is not about ego!</p>
<p>I realized that when I helped someone and they did not say thank you, what was supposed to happen is that , I should feel anger because it is all about ego, right?</p>
<p>But what really happened that I felt happy just to help now people who are reading this will say either “you are so kind” or “Okay, you want to make it up huh!”but
the reality is just neither this or that ; actually I realized that I am helping people because this is what make us humans and this thing let us feel that we are not alone in this world so
it is kind of socializing too and also when you help people, I guarantee that someday someone will help you in a very tough situation and he or she will come out of nowhere this is the rule
of life and this is how people should live.</p>
</body>
</link>
</head>
</html>
Your script runs before the DOM is parsed so:
var target = document.getElementById("unique_element");
won't return the HTML element and target.length will simply fail. Try to put the JavaScript part before the closing </body>-tag.
You are trying to show the length of a DOM Element.
Try alert(target.innerHTML.length); instead.
Related
When I set dir="rtl", the trailing punctuation mark is rendered at the start.
I expect that the result is
I have a cat, her name is "butterfly"
but the actual result is "I have a cat, her name is "butterfly
What should I do to get the right text?
Thanks for your help.
Below is my code,
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en-US" xml:lang="en-US" dir="rtl">
<head>
<title>
Create custom shape button
</title>
</head>
<body onload="load()">
<button id="b_button">
<div id="b_button_label" width="500px" height="30px"></div>
</button>
</body>
<script>
function load() {
let label = document.getElementById("b_button_label");
label.textContent = `I have a cat, her name is "butterfly"`;
}
</script>
</html>
The wrong result picture is,
I'm a baby to programming and I aim to spend a few short minutes a day going through Stack to try to help the community however I can.
I struggled to find, or use the right phrases, to search the web but while testing how the characters in the quotation marks, I noticed that you can add "butterfly" to make it, '..."butterfly" butterfly'. and the output works just fine.
This could be a logic/grammar issue. Sorry I couldn't be of much help - hope this somehow helps your search!
I am a complete beginner to javascript. I am also new to this website. I am asking for help to complete an assignment. I have been trying for more than 4 hours by looking at lecture material and online for a solution. It is causing me a lot of unnecessary stress. Before javascript we only used CSS and Html. I was given 6 javascript tasks to manipulate the html file (taskc.html) already given to me.
The tasks are as follows
Make a statement to change contents of h1 from "Welcome" to "Text"
2nd statement should make an new alert window when the page loads that delivers a message explaining what the page is about
3rd statement should change the title to "text"
4th statement should log the contents (innerHTML) of the first paragraph element in the console.
5th statement should hide the contents of the second paragraph when the page loads
6th statement should change the contents of the header to have a new colour of your choice
Here is that html.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Task C - The Document Object Mode</title>
</head>
<body>
<h1 id="header">Welcome</h1>
<p id="first">This site uses JavaScript</p>
<p id="second">Javascript is very useful</p>
</body>
</html>
Because the actual coding im meant to add is meant to be in the .js file I was given. so I figured I had to link the js file in the html file so I added
<script type="text/javascript" src="taskc.js"></script>
With that out of the way I went to the lecture notes and I thought I would simply need to modify some of the code given to me there like
document.getElementById('demo').innerHTML = 'Hello World!';
When I put this code in brackets I got the error (document is not defined)
I modified it to match the requirements for task 1
here it is
document.getElementById('header').innerHTML = 'text';
I was confused because I didn't know what this error meant and of course Errors and how to fix them are never explained so I had to lookup how to resolve the error.
I found that to fix it I have to declare it as a variable so I ended up doing this.
var document = 'taskc.html';
When I did this for document, alert and console all the errors went away, but when I did a live preview only statement 1 was working
If anyone could help me fix this I would really appreciate because I don't understand enough javascript to be able to complete this in a reasonable amount of time.
So first: Please use Javascript functions to keep your code tidy and clean.
Example:
HTML:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Task C - The Document Object Mode</title>
</head>
<body>
<h1 id="header">Welcome</h1>
<p id="first">This site uses JavaScript</p>
<p id="second">Javascript is very useful</p>
<script type="text/javascript" src="taskc.js">test();</script>
</body>
</html>
function test(){
alert("This is a test!");
}
Always implement scripts that are document referenced at the bottom of your html.
If you use JQuery you can use following code to check document is loaded:
$(document).ready(function(){
//foo bar
});
So far, this is what I do:
<?php
?>
<!DOCTYPE HTML>
<meta tags>
<script src>
<title>
<links>
<head>
<style>
</style>
</head>
<body>
<html>
<javascript>
<some php>
</body>
I realize that some things have to be in a certain order for example, an element has to exist before it can be modified; I'm talking about javscript.
I think that the <link><meta><title>etc... have to be in the header... also curious if I need the <!DOCTYPE HTML> as well as the language declaration
I think I also realize that pages are parse from top left to bottom right per character. So...
Any help would be appreciated, I'm looking for easy to read formatting so that other people who read the code can pick it up relatively easily <- awful two words
I am working from the book "Simply JavaScript" and there is an example on pages 68-69 that I cannot get to run. I have copied it from the book and I am working with a fellow student. I think there must be a coding error in the example and was hoping someone could look it over real quick and give us some guidance.
From what I understand the script should cause an alert box to pop up and display the node name (which according to the book should just be a)
Here is the HTML
<!doctype html>
<head>
<script type="text/javascript" src="script.js"></script>
<meta charset="utf-8">
<title>
Stupid Title
</title>
</head>
<body>
<h1>
Sniper (1998)
</h1>
<p>
In this cinema masterpiece
<a id ="berenger" href="name/nm0000297/">tom Berenger</a> plays a us soldier working in the Panamanian Jungle.
</p>
</body>
And here is my JavaScript
alert("AAAAAAAAAAAAAAHH");
var target = document.getElementById("berenger");
if (target != null)
alert(target.nodeName);
This is my second week of javascript class so I'm pretty new with it.
The DOM isn't ready at this point:
<script type="text/javascript" src="script.js"></script>
Move that line to the end of <body>
Read about those kind of issues in this docs
I'm fairly new to programing, especially javascript. I have created what I am regarding as an net-art project that refreshes a browser and cycles through a series of images. I want the browser window to automatically resize to the dimensions of the images, 612x612 px. I've tried everything I can think of, everything I've come across on the web, and nothing seems to work with the code I have set up for the refresh and image load. I need assistance.
Let me say that I am normally against such unser unspecified browser resizes or any intrusive script that doesn't allow the user to make that decision on his/her own. But this is an art project and will only exist as part of a gallery on my own website and the user will be warned ahead of time, before clicking the link, that their browser will resize.
What I want is for the browser to resize to the specified dimensions when the page loads, then cycle through the images, via the automatic refresh.
So please, anyone who would be willing to offer their assistance with this I would be very very grateful. I've gotten pretty far I think and this resize is the last little bit of the puzzle. Thank you in advance.
You can see the rough project with no resize here: http://jasonirla.com/bgchange%202/
and the code I'm using:
<!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 http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="title" content="Background Change" />
<meta name="description" content="Background Change" />
<title>Everyday Sky</title>
<script type="text/javascript">
// auto refresh window PT 1
function timedRefresh(timeoutPeriod) {
setTimeout("location.reload(true);",timeoutPeriod);
}
// no. of images in folder is 43
var totalCount = 43;
// change image on refresh
function ChangeIt() {
var num = Math.ceil( Math.random() * totalCount );
document.body.background = 'images/'+num+'.jpeg';
}
</script>
</head>
<!-- Refresh PT 2 with timer in seconds 5000=5seconds-->
<body onload="JavaScript:timedRefresh(100);">
<script type="text/javascript">
ChangeIt();
</script>
<style type="text/css">
body {
background-repeat: no-repeat;
}
</body>
</html>
It's true, you can only set the size of a browser window by creating a new window with JavaScript but many security settings will block pop-up windows. I think it's bad UI design to do what you're attempting anyway. If you really want something modern and highly functional, Lightbox (as mentioned above) is a great tool as well as the dialog box in the jQuery UI.
Since this for an exhibition, you will choose what browser to use but most new browsers dont let JavaScript resize them anymore. Worth a try, though.
<body onload="JavaScript:timedRefresh(100);resizeTo(500,500);self.moveTo(640,10);>
....
</body>
Cheers.