Geek Answers Handbook

Internet Explorer innerHTML prints attributes without quotes

I am using IE 8 and trying to set the element identifier attribute. Then I add this element to the parent element and check its innerHTML. The problem I see is that there are no double quotes in the id attribute. At first, I thought this could be the reason that I was using the setAttribute property, and that could be a bug in IE 8, so I used jQuery to set attribute values, but the problem was still there. Here is my code ...

var imgId="my" + val_imgarea + "img"; var img=document.createElement('img'); $(img).attr("Id",imgId); img.setAttribute('src',name); img.setAttribute('style',"width:100%;height:100%"); $(img).click(function(){clic(imgId);}); var input=document.createElement('input'); input.setAttribute('type','text'); input.setAttribute('id',name); input.setAttribute('style',"display:none"); var parent=document.getElementById(newArea); parent.appendChild(img); parent.appendChild(input); alert($("#"+newArea).html());

output

 <IMG id=my21img style="width:100%;height:100%" src="a/img.jpg" />

I need double quotes with id cauze. Then I write this html to a file, and then some other applications read it and cause problems with missing quotes.

+4
source share
2 answers

HTML does not require that attributes be wrapped in quotation marks; IE 8 and below will return attributes without quotes if they do not have a space. Other applications that parse this HTML are clearly not HTML parsers, and if they are intended, the error needs to be fixed with them.

'In some cases, authors may indicate the value of an attribute without quotation marks. The attribute value can contain only letters (az and AZ), numbers (0-9), hyphens (ASCII decimal 45), periods (ASCII decimal 46), underscores (ASCII decimal 95), and colons (ASCII decimal 58 ) We recommend that you use quotation marks, even if they can be removed. ''

Note that on your output you have a final slash / at the end of the <IMG tag. Internet Explorer doesn't put them in (I don't think any browser does). This is an XML idiom and is also not required for HTML.

+4
source

If $ == jQuery:

 var imgId="my" + val_imgarea + "img"; $i = $('<img src="" style="width:100%;height:100%" id="'+imgId+'" />'); $i.click(function(){alert(this.id);}); $(parent).append($i);
0
source

More articles:


All Articles