createElement not working in IE 8 and less - javascript

I have been struggling with an issue and have boiled it down to IE 8 and less. My suspicion is createElement. Can anyone help.
This is the stripped down code to the bare minimum
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<head>
<script>
var s=document.createElement('script');
s.type='text/javascript';
s.src="myscript.php";
document.getElementsByTagName('head')[0].appendChild(s);
</script>
</head>
<body>
</body>

Wrap your entire HTML with <html> tags:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<script>
var s=document.createElement('script');
s.type='text/javascript';
s.src="myscript.php";
document.getElementsByTagName('head')[0].appendChild(s);
</script>
</head>
<body>
</body>
</html>

Related

Is it possible to format an ugly HTML code using Javascript?

For Example I have a code 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=iso-8859-1" /><title>Untitled Document</title></head><body></body></html>
Above ugly code output after source format using javascript 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=iso-8859-1" />
<title>Untitled Document</title>
</head>
<body>
<p>Test</p>
<b>Test Format</b>
</body>
</html>
Please help me on this.....Thanks

Weird bug in Firefox using disabled="disabled"

I nibbling on a bug in ff:
See http://nocturne.wmw.cc/bugff.html (not reproducable in jsfiddle - too bad)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<script src="//code.jquery.com/jquery-1.11.0.min.js"></script>
</head>
<body>
<button disabled="disabled">sdf</button>
<script>
jQuery(function(){
if(!jQuery('button').is(':disabled'))
alert('Is not disabled!');
jQuery('button').removeAttr('disabled');
});
</script>
</body>
</html>
Now the Problem:
If i load the first time, everything is ok.
If i reload the page using Ctrl+r, the alert() shows the error-message.
If i Reload using Ctrl+Shift+r the bug does not occoure.
I do use Microsoft® Windows® 7.
Reproduceable at least at FF28, FF29.
How to solve?
The issue seems to be the same mechanism that stores user-input for form-elements, the state of the button has been cached.
possible solution(see: How can I stop Firefox from caching the contents of a textarea on localhost? ):
<button disabled="disabled" autocomplete="off">sdf</button>
http://jsfiddle.net/doktormolle/4ZLd9/show/
Just try disabled instead of disabled = "disabled"
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<script src="//code.jquery.com/jquery-1.11.0.min.js"></script>
<body>
<button disabled>sdf</button>
<script>
jQuery(function(){
if(!jQuery('button').is(':disabled'))
alert('Is not disabled!');
jQuery('button').removeAttr('disabled');
});
</script>
</body>
</html>

Javascript frameset navigation

It is a long time since I programmed web. How do I perform javascript frameset navigation (or replace the frameset with an exact equivalent):
<frameset rows="*,32">
<frame src="about:blank" id="viewer">
<frame src="cgi/browse.exe?images">
</frameset>
The webpage generated by browse.exe conains an javascript array with a list of files, and two buttons: previuos and next. When the user clicks next, next file should be displayed in the "viewer".
I have tried
parent.frames["viewer"].location.assign("...");
without success in FF. It works in IE. Note that the navigation works fine as long as I stay inside the same frame.
Try to replace the id with the name attribute, then it should work well in all browsers. Tested it on these pages:
<!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>
<title>index.html</title>
</head>
<frameset cols="240,*">
<frame name="fmenu" src="leftmenu.html" scrolling="yes"/>
<frame name="viewer" src="page1.html" scrolling="yes"/>
<noframes><p>noframes</p></noframes>
</frameset>
</html>
<!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>
<title>leftmenu.html</title>
</head>
<body>
<a onclick="window.parent.frames['viewer'].location.assign('page2.html')">test</a>
</body>
</html>
<!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>page1,2.html</title>
</head>
<body>
<p>START PAGE</p>
</body>
</html>

twitter share button doesn't count properly

I tried to change my ip then share it again but still doesn't count.
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 http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script>
<title>:: my test ::</title>
</head>
<body>
Tweet
</body>
</html>
someone could help me?
Have you tried adding the JavaScript under the anchor tag.
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id))
{js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}
(document,"script","twitter-wjs");</script>
as described at https://dev.twitter.com/docs/tweet-button

Is the following valid XHTML 1.0 Transitional?

The w3c validator service complains that the following html is invalid. It does not like the ampersand(&) in my javascript. But ampersands are allowed in javascript strings, aren't they?
<!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>
<title>Page Title</title>
</head>
<body>
<script type="text/javascript">
function search(query) {
redir = "http://search.mysite.com/search?s=FIN&ref=&q=" + query;
window.location.href = redir
return false;
}
</script>
<span>This is all valid HTML</span>
</body>
</html>
All browsers will take this, but to make it valid X(HT)ML you need to put the Javascript code in a CDATA block.
Even in javascript w3c validator don't like ampersands. Try to comment your javascript from validator
<!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>
<title>Page Title</title>
</head>
<body>
<script type="text/javascript">
//<![CDATA[//><!--
function search(query) {
redir = "http://search.mysite.com/search?s=FIN&ref=&q=" + query;
window.location.href = redir
return false;
}
//--><!]]>
</script>
<span>This is all valid HTML</span>
</body>
</html>
No, it is indeed not valid. If you want to use in-line JavaScript in an XHTML file, you'll need to wrap the JavaScript in CDATA. If you don't want to do that, then you're stuck with encoding &, < and >, which in JavaScript can be quite a pain.

Categories