I have a file named Reservation.xhtml and in it, I have the script tag in which the external js file is called.The Reservation.xhtml contains a form that i have downloaded from a website and also its javascript which i saved into "validate.js"
<script src="validate.js" type="text/javascript"></script>
When using Reservation.xhtml, the functions in the validate.js are not being called but when i change the extension of Reservation.xhtml to Reservation.html..The form works fine..So can anybody tell me why the validate.js works in the Reservation.html and not in the Reservation.xhtml.. Please suggest me how to make it work in Reservation.xhtml
According to my tests, there is nothing wrong with the thing you're doing.
I created such file:
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Strict document</title>
</head>
<body>
<p>This is a strict XHTML document.</p>
<div id="validate" style="color:red"><tt>validate.js</tt> has not been called!</div>
<script src="validate.js" type="text/javascript"></script>
</body>
</html>
Linked script would alter the innerHTML and style of the div - and it worked in Firefox.
Now while it seems that the file extension and doctype do not matter, there are things that do.
Specifically, tagName which is a HTMLElement property, is different in HTML and XHTML:
In XHTML (or any other XML format), "span" would be alerted. In HTML, "SPAN" would be alerted instead. - MDN
This might cause your script not to perform some operations.
Related
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.
CKEditor 4.2.1 (and 4.1.2) is randomly (doesn't happen every time) throwing a JavaScript error when performing very basic/simply interactions, like clicking in the editing area and/or typing in the editing area.
Here's my HTML:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
<title>My Page</title>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
<script
type="text/javascript"
src="/assets/js/ckeditor_4.2.1_full/ckeditor.js"></script>
<script type="text/javascript">
$(function(){
CKEDITOR.replace('my_text');
});
</script>
</head>
<body>
<form method="post">
<textarea name="my_text">dfagasdf sdf<br /><br />dasf asdf</textarea>
</form>
</body>
</html>
When clicking or typing into the editing area I see multiple errors in my console:
Have you switched Document Mode to Quirks manually? This may be a reason (although CKEditor is supposed to work in QM and I know it does). Second thing - wrap <textarea> with <fieldset> or <p>. I've seen that it makes problems from time to time (and it's also incorrect to have textarea directly in form).
Edit: The page is running in Quirks Mode, because you've got incorrect DOCTYPE. You should have:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
Instead of:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
After fixing this, IE stops throwing this error.
PS. You shouldn't also use ISO-8859-1 encoding, which is poor and may lead to issues. Use UTF-8 instead.
Ok, so i have this HTML web page with nothing fancy on it right? The problem is that when I try to place an image on the screen without using CSS (with the traditional < img > tag), I get this error in FireFox:
Use of attributes' nodeValue attribute is deprecated. Use value instead.
The image display is simple, just the tag and the src.
Here is the code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
<html>
<head>
<link rel="stylesheet" type="text/css" href="administration/stylesheet.css">
<meta http-equiv="content-type" content="text/html;charset=utf-8">
</head>
<body>
<img src="administration/graphics/textlogo.png">
</body>
</html>
I hope someone knows what to do, cause I can't seem to find a solution.
Cheers!
I have following 2 files as 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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>
<script>
function init(){
document.getElementById("mytest").innerHTML= "Results after rendering...";
}
</script>
<body onload="init();"><div id="mytest">OK</div>
</body>
</html>
The second page usually give the alert popup all source code of first page.
<!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" />
<title>Untitled Document</title>
</head>
<script>
xmlhttp.open("GET", "test.html",true);
xmlhttp.onreadystatechange=function() {
if (xmlhttp.readyState==4) {
alert(xmlhttp.responseText)
}
}
xmlhttp.send(null)
</script>
<body>
</body>
</html>
All I want to do is I would like to get ONLY source code after rendering. How can get all code after rendering instead of getting all original code. So i can read < div id="mytest">Results after rendering...< / div> when I try with XMLHTTP. How can I do how to get the code which are already render for page, I want only with classic Javascript or DOM, I don't want with Jquery, JSON, Mootool at all. thanks in advance.
Instead of loading the page with ajax, use your browser's iframe support to your advantage.
Change the second file that alerts the HTML source to something like this:
<!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" />
<title>Untitled Document</title>
</head>
<script>
function displayAlert()
{
alert(document.getElementById('iframe').contentDocument.body.innerHTML);
}
</script>
<body onload="displayAlert()">
<iframe src="test.html" id="iframe" style="display:none;"></iframe>
</body>
</html>
This will load test.html in an invisible iframe. Your browser will automatically render test.html inside the iframe and will call displayAlert() when it is done. displayAlert() will grab the the source code inside the iframe and alert it. However, this solution will only work if test.html is on the same server as the script above. If test.html is on a completely different server, this solution will not work because the permission to access the iframe will be denied. If this is the case, I can let you know of another solution that will bypass this.
I'm not sure I know what you're really asking, but why not just get:
alert(document.body.innerHTML);
to get the actual rendered body HTML with any changes that have been made by scripts upon loading.
Note: even unmodified parts of innerHTML will not always compare exactly to the original source HTML because in some cases browsers are reconstituting the innerHTML from some other parsed data form so attributes may not have the same quoting or be in the same order and capitalization may not be the same.
I try to do an AJAX call with jQuery and $.post in Internet Explorer, but all I get is an error saying "Permission denied". The problem is kinda weird since it occurs only when I access a page after I was on any other page.
For instance I type the URL in the adress line and let IE load the page. Then I click on a button so the script should start loading JSON data. (The script providing the data lies on the same server and I access it with a relative URL, so using a different domain is not the problem here. Even tried to use a absolute URL with the same host part.)
But when I refresh the page then and try it again it works! Same thing when I come to that page from another page. At first nothing works, but when I click "refresh" everything is fine.
IE gives me the error message "Permission denied" while in every other browser I don't notice this behaviour. Since I have tried many things and still cannot imagine where the problem lies I'd like to ask you what you think the problem might be?
edit:
A small example:
test.html
<!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" xml:lang="de">
<head>
<script type="text/javascript" src="/ietest/jquery.js"></script>
<script type="text/javascript" src="/ietest/test.js"></script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
</head>
<body>
Test
</body>
</html>
ajax.html
It works!
test.js
$(document).ready(function(){
$( 'a' ).click(function(){
$.post( '/ietest/ajax.html', function( data ) {
alert( data );
});
});
});
Try it here: http://t1318.greatnet.de/ietest/test.html
From the post on jquerys forum here, you have to have the content type meta as the first item in your head tag.
<!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" xml:lang="de">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="/ietest/jquery.js"></script>
<script type="text/javascript" src="/ietest/test.js"></script>
</head>
<body>
Test
</body>
</html>
If its local (localhost), then for security reasons you have to have the full path.
In my case, changing the jquery version worked. Instead of using version 1.9.1, now I'm using 1.12.4 and it works.