JavaScript - Document.createelement('p'); Error
So i 've reviewed my work and can't see what i've done wrong.
here is the html <code><html> <head> <title>Javascript Practic</title> <script type="text/javascript" src="Practice.js"> </script> </head> <body> write something here <div id="here"> blue here</div> </body> </html></code> and here is the javascript: <code> window.onload = tryInnerHTML; function tryAlert(){ alert("just trying it out"); } function tryInnerHTML(){ var p = document.createElement('p'); here = document.getElementById("here"); here.style.color = "blue"; p.innerHTML("<b>This is Dynamic</b>"); here.appendChild(p); } </code> firebug is saying the error is p.createElement('p'); but for the life of me I can't guess why any help would be very appreciative. Similar TutorialsHello everyone. I'm having a little problem with creating a element in internet explorer. The element that I'm creating is a div with a few style attributes to to it. The div is suppose to cover the whole page almost like a black transparent window on the page. However it is not. The messed up part about this is that it works fine in Firefox, google chrome and I'm sure other browsers (though haven't tested) and when I go to apply the div in my actual code as javascript is suppose to when you tell it create it, it works fine. No problems whatsoever... I'm not to sure what I'm doing wrong here and it would be great if I could get some help with this. Thanks Code: function showPhotoUpload() { var overlay = document.createElement("div"); overlay.setAttribute("style","z-index:3; background:#111111; width:100%; height:100%; position:absolute; top:0; opacity:0.5; filter:alpha(opacity:50);"); document.body.appendChild(overlay).lastChild; } Hi all, I am attempting to create an element (to be added later to the document DOM) using createElement. My test case is just: document.createElement("<p>Hello World</p>"); My error console shows the following error: Error: uncaught exception: [Exception... "String contains an invalid character" code: "5" nsresult: "0x80530005 (NS_ERROR_DOM_INVALID_CHARACTER_ERR)" location: "http://192.168.1.10/projects/test/public_html/js/test.js Line: 10"] Any ideas? I am trying to add a green tick or red cross to my form so that the user will know if they have filled out the form correctly before submitting it and getting told that they need to fill out this or correct that. I have added NAME to each form field and have been using this to read the content but for some reason I am unable to read what is in the field I get the error, 'undefined'. this is what code I have started on... Code: function checkValidFormInput(id, noCheck) { if (noCheck == '') { var idValue = document.getElementsByName(id); if (id == 'customerName') { alert(id); alert(idValue.value); if (idValue != '') { document.getElementsByName(id + 'Img').innerHTML = '<img alt=/"/" src=/"/">'; } } if (id == 'customerEmail') { if (idValue != '') { document.getElementsByName(id + 'Img').innerHTML = '<img alt=/"/" src=/"/">'; } } } } my code is still in the early stages and is missing the other parts to place a red cross, as the moment i am working on placing the green tick. Can anyone spot what I have wrong in my code that is causing it not to read the form field. my form field is coded as so.. Code: <li class="value"> <input type="text" autocomplete="off" name="customerName" value="<?=$fullname;?>" style="width: 200px;" onChange="checkValidFormInput(this.name, '');"> <div style="float: left;" id="customerNameImg"></div><br style="clear:both"> </li> Hi Coders, I have a javascript function which lets a user to choose one of the 7 option buttons on a "mainsub.asp" page and the page will then be forwarded to one of the 7 process pages depending on what has been chosen. The problem is that firefox is angry with the first line ("if" statement) and tells the following in its error console: Error: document.forms[0].C1 is not a function Source File: [localhost...] Line: 117 Here is the code: function fSubmit(){ if (document.forms[0].C1(0).checked) document.forms[0].action="process.asp"; else if (document.forms[0].C1(1).checked) document.forms[0].action="process1.asp"; else if (document.forms[0].C1(2).checked) document.forms[0].action="process2.asp"; else if (document.forms[0].C1(3).checked) document.forms[0].action="process3.asp"; else if (document.forms[0].C1(4).checked) document.forms[0].action="process4.asp"; else if (document.forms[0].C1(5).checked) document.forms[0].action="process5.asp"; else if (document.forms[0].C1(6).checked) document.forms[0].action="process6.asp"; else document.forms[0].action="process.asp"; return; } Internet explorer does not complain about anything and does its job great. But I could not figure out how to change the code to be also compliant with Firefox? Thanks for all the comments. Without elaboration plz see my code: Code: <body> <script> var b="s"; </script> <button target="_blank" onclick="window.open('http://......php?b="javascript:document.write(b);"&id=2&q=<?php print $_GET['q']; ?>','1','');return false;">xyz</button> </body> i don understand why this javascript:document.write(b); doesnt work in url... i know its simple yet it make my hair out of my head. plz count it.. Hi, first post here. I was working on code for opening a link in a new window when clicked. I read somewhere that it's a good idea to remove all of the javascript elements from the HTML. So I pieced it together and it works. But I get the following error in IE8: Code: Message: 'document.getElementById(...)' is null or not an object Here's the relevant HTML: Code: <a href="http://www.samplesite.com" id="sampleid">Sample Text</a> And here's the relevant javascript that I put in a seperate .js file: Code: function samplefct() { window.open(this.href);return false; } window.onload = function() {document.getElementById("sampleid").onclick = samplefct; } The code does work as planned. But I'd still like to get rid of the error. Can anybody think of a different way of stating the javascript that would perform the same thing and lose the error? Any help would be greatly appreciated. Thanks! IB Hello, I'm trying to create a new link element using JS but using the following code: Code: writeCredits : function () { if (this.credits) return; this.credits = hs.createElement('a', { href: hs.creditsHref, target: hs.creditsTarget, className: 'highslide-credits', innerHTML: hs.lang.creditsText, title: hs.lang.creditsTitle }); this.createOverlay({ overlayId: this.credits, position: this.creditsPosition || 'top left', hsId: 'credits' }); }, It has the target but can I add anything to the createElement to make it open in a new window? Thanks for the help. This opens up in my current Hey this is my java script it works fine in FF , but in IE it shows type mismatch error .It shows my innerhtml page and also runs my script but i want to remove the type mismatch error would really appreciate your help.Thank you . Here is my javascript function function submitForm(){ // create request var xmlhttp = null; var serverhttp=null; if (window.XMLHttpRequest) { xmlhttp = new XMLHttpRequest(); serverhttp=new XMLHttpRequest(); if ( typeof xmlhttp.overrideMimeType != 'undefined') { xmlhttp.overrideMimeType('text/xml'); serverhttp.overrideMimeType('text/xml'); } } else if (window.ActiveXObject) { xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); serverhttp = new ActiveXObject("Microsoft.XMLHTTP"); } else { alert('Perhaps your browser does not support xmlhttprequests?'); return; } // submit in JSON notation var email = document.customer.elements[0].value; var companyName = document.customer.elements[1].value var input = '{email:"'+email+'",company_name:"'+companyName+'"}'; var url = "URL"; var cgi = "URL/script.cgi"; xmlhttp.open('POST',url,true); //serverhttp.open('POST',url,true); // show feedback xmlhttp.onreadystatechange = function (aEvt) { var newDiv = document.createElement("div"); newDiv.innerHTML = "<b>Thank You!</b>"; //type mismatch occures over here document.body.replaceChild(newDiv,document.customer); serverhttp.open('POST',cgi,true); serverhttp.send(companyName); } xmlhttp.send(input); } Hey this is my java script it works fine in FF , but in IE it shows type mismatch error .It shows my innerhtml page and also runs my script but i want to remove the type mismatch error would really appreciate your help.Thank you . Here is my javascript function function submitForm(){ // create request var xmlhttp = null; var serverhttp=null; if (window.XMLHttpRequest) { xmlhttp = new XMLHttpRequest(); serverhttp=new XMLHttpRequest(); if ( typeof xmlhttp.overrideMimeType != 'undefined') { xmlhttp.overrideMimeType('text/xml'); serverhttp.overrideMimeType('text/xml'); } } else if (window.ActiveXObject) { xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); serverhttp = new ActiveXObject("Microsoft.XMLHTTP"); } else { alert('Perhaps your browser does not support xmlhttprequests?'); return; } // submit in JSON notation var email = document.customer.elements[0].value; var companyName = document.customer.elements[1].value var input = '{email:"'+email+'",company_name:"'+companyName+'"}'; var url = "URL"; var cgi = "URL/script.cgi"; xmlhttp.open('POST',url,true); //serverhttp.open('POST',url,true); // show feedback xmlhttp.onreadystatechange = function (aEvt) { var newDiv = document.createElement("div"); newDiv.innerHTML = "<b>Thank You!</b>"; //type mismatch occures over here document.body.replaceChild(newDiv,document.customer); serverhttp.open('POST',cgi,true); serverhttp.send(companyName); } xmlhttp.send(input); } Hi all, A few quick questions: Is there a difference between these two lines of code: var e = document.createElement('img'); -and- var e = new Image(); Both seem do do the same thing and act the same way... which makes me wonder why the second one even exists. There isn't a corresponding "new Div();" function, for example.... Second question: If I create an element to use temporarily and do not ever insert it into the DOM, do I need to delete or destroy it afterwards? Will it use memory (a memory leak) if I don't get rid of it after using? Thanks! -- Roger I have a problem that I have been told to fix. The code that is there work perfectly in Firefox, but throws errors in IE and will not work. Code: var newtbody = document.createElement("tbody"); newtbody.id = "ROW"+newkey; document.getElementById(trElement).parentNode.insertBefore(newtbody,document.getElementById(trElement)); newtbody.innerHTML = gcp; gcp has the HTML for inside the tbody tag. The error I get in IE is the "Unknown runtime error". I have tried some of the "solutions" that I have seen online but none have worked. Can anyone help? I'm trying to check to see if a dynamically created element exists BEFORE creating another element of the same exact type...but my if statement at the beginning is not working and another element is just created. Code: function writeElement(id) { if(document.getElementsByTagName('transElement')[0]) { var id = id; killElement(); writeElement(id); } var id = id; var transElement = document.createElement('transElement'); var solidElement = document.createElement('solidElement'); var closeElement = document.createElement('closeElement'); //transElement.id = "transElement"; transElement.setAttribute('id', 'transElement'); solidElement.setAttribute('id', 'solidElement'); closeElement.setAttribute('id', 'closeElement'); closeElement.setAttribute('onClick', 'killElement()'); closeElement.innerHTML = "Close"; var content = "inject_poem.php?id=" + id; getdata(content, 'solidElement'); document.body.appendChild(transElement); document.body.appendChild(solidElement); document.body.appendChild(closeElement); } Does anyone know what is incorrect about my if statement? Please delete, someone had a retard moment
I'm getting the following problem. The reason is that the object appears through AJAX. But if I choose it NOT to appear it gives this problem. How can I avoid this? I put an if statement inline Code: if(document.getElementById('vsbtitle_1').value!=null){ thisurlext+='&btitle1='+document.getElementById('vsbtitle_1').value; } But it doesn't help. Quote: Error: document.getElementById("vsbtitle_1") is null Source File: javascript:%20var%20file='forforum.php';%20var%20thisurlext='?type=forforum&btitle0='+document.getEl ementById('vsbtitle_0').value;%20if(document.getElementById('vsbtitle_1').value!=null){thisurlext+=' &btitle1='+document.getElementById('vsbtitle_1').value;%20}%20var%20checkedlength=0;%20thisurlext+=' &checkresult0=';%20for(i=0;i<document.getElementsByName('checkresult_0').length;++i){if(document.get ElementsByName('checkresult_0')[i].checked){thisurlext+=document.getElementsByName('checkresult_0')[i].value;checkedlength++;if(i+1<document.getElementsByName('checkresult_0').length){if(document.getEle mentsByName('checkresult_0')[i+1].checked){thisurlext+='+';}}}};%20thisurlext+='&checkresult1=';%20for(i=0;i<document.getElementsByNa me('checkresult_1').length;++i){if(document.getElementsByName('checkresult_1')[i].checked){thisurlext+=document.getElementsByName('checkresult_1')[i].value;checkedlength++;if(i+1<document.getElementsByName('checkresult_1').length){if(document.getEle mentsByName('checkresult_1')[i+1].checked){thisurlext+='+';}}}};var%20getKeyURL='';%20for(a=0;%20a<document.getElementById('txtid').v alue;%20a++){if(document.getElementById('txtarea_'+[a]).value!=%20''){getKeyURL+='&txtarea'+[a]+'=';}getKeyURL+=document.getElementById('txtarea_'+[a]).value;}var%20thisnewurlext=file+thisurlext+getKeyURL;%20forForum(); Line: 1 My code is here and it works ... However, I would like my dynamic table to show on the same page as my body and not on a new blank page. I have created a DIV and try playing around with the document.getElementById('monTab').innerHTML but it's not working out for me ... What am i missing ? Regards, Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <HTML><HEAD><TITLE>new Script - Javascript Cours 11</TITLE> <META content="text/html"; charset="UTF-8" http-equiv="content-type"> <SCRIPT type="text/javascript"> function createTable(){ var Etudiant = new Array(Number(prompt("How many Students will you put in ?",""))); document.write("<table border=\"1\">"); for (var i=0; i<Etudiant.length; i++) { Etudiant[i] = window.prompt("S'il vous plait entrez le nom d'un etudiant " + (i+1) + ".","") alert("Nice to see you "+Etudiant[i]); document.write("<td>"+Etudiant[i]+"</td>"); j = parseInt(prompt("Combien de notes voulez vous calculez ?")); for (h=0;h<j;h++){ notes[h] = parseInt(prompt("S'il vous plait entrez la "+(h+1)+" note de "+Etudiant[i])); document.write("<td>"+notes[h]+"</td>"); } document.write("<tr>"); } document.write("</tr>"); document.write("</table>"); document.getElementById('monTab').innerHTML=Etudiant; } </script> <BODY> <H1>Combien de note voulez vous cumulez ?</H1> <br> <br> <input type="button" name="btnSubmit" value="TRY IT" onclick="createTable()"> <div id="monTab" size="10"> Content should come here ...Content should come here ...Content should come here ...Content should come here ...Content should come here ...Content should come here ...Content should come here ... </div> </BODY> </HTML> I found this line in one of the scripts on javascript.kit <code> if(document.layers|| document.getElementById|| document.all) </code> Could someone give me an idea on why this line would be used in a code? Thank you very much I'm working on a website that will basically embed a widget/frame sent by a handler into a user's current page. The user basically adds a script tag to where they would like the HTML to be. The script tag has their settings and is basically a document.write that calls all the code that we want displayed. So here's my problem. We have a map that we need to add in a specific section, and to get the map we have to call another script tag. So we end up having a script tag (map) embedded in another script tag (the code for the widget/frame) or we end up having to document.write inside a document.write. Now this works just fine and as expected in Firefox, Safari, and Chrome. However, Internet Explorer and Opera wait until the first document.write is completely finished before calling the embedded one. Of course the problem with this, is that it takes the map out of the document's flow and just appends it to the bottom left of the page. Since the rest of the page has already been called, there's no way to move the interior "map" script. Any ideas? Basically just trying to figure out how (if even possible) to render an embedded script tag in Internet Explorer and be able to place it properly. I've tried everything that I can think of, including AJAX and Google's unescape script. Any suggestions, I'd greatly appreciate it. Or even if you've encountered a similar problem, and know that it just isn't possible in IE or Opera, that would be fine too. Thanks in advance! What I'm trying to get are the tag ids separately after I call the callback function. I've been racking my brain for far too long on this one. Here is a shorter version of what I have. I'm using the array's length to count and break into their own lines. How do i get all 9 id="hover_[index]" separately using my array length? PHP Code: var info = Array("bla_1", "bla_2", "bla_3", "bla_4", "bla_5", "bla_6", "bla_7", "bla_8", "bla_9"); function callback(results, status) { if (status == myStatus) { for (var i = 0; i < results.length; i++) { send(results[i]); } } } function send(info) { document.getElementById('results').innerHTML += "<div id='hover_"+info.length+"'>Something</div>"; hover_target = document.getElementById('hover_'+info.length);// how do i get all 9 hover_[index] separately? someEvent.addDomListener(hover_target, 'mouseover', function() { // do something }); } Thank you so much in advance, Frank |