dean.edwards.name/weblog/2004/12/ie7-security/

Comment: #1

Why can’t you just load it like a style switcher does? Or (if that only switches sheets – never used one) create a new style tag to add to the head section? The latter works with scripts. Something like:

function loadCSS(cssSrc){
	var head = document.getElementsByTagName('head').item(0);
	x = document.createElement('link');
	x.src = cssSrc
	x.type = 'text/css';
	x.rel = 'stylesheet';
	//script = document.createElementNS(xhtml,'link');	//something like this for xhtml mime type
	//script.setAttributeNS(xhtml,"src",cssSrc);
	//script.setAttributeNS(xhtml,"type",'text/css');
		//script.setAttributeNS(xhtml,"rel",'stylesheet');
	head.appendChild(x); 
}

I think you have to give it a name, then call it, though.

Comment: #2

Why can’t you just load it like a style switcher does?

Because I want to load the file into memory not directly into the DOM.

Comment: #3

Dean,

It seems that the solution no longer works in IE 6 SP 2. Therefore, use the following pattern:

function loadFile(url) {
	var newFrame = document.createElement("xml");
	newFrame.async = false;
	return newFrame.load(url) ? getNodeString(newFrame) : "";
};

function getNodeString(node) {
	return (node.nodeValue !== null) ? node.nodeValue : getChildrenString(node.childNodes);
};

function getChildrenString(children) {
	var nodeString = "", numOfChildren = children.length;
	for (var ii = 0; numOfChildren > ii; ii++)
		nodeString += getNodeString(children[ii]);
	return nodeString;
};

That’s a little more elegant than the previous version. Here’s a demo (that I may take down if I run out of online disk space). It seems that the behavior of node.nodeValue changed between revisions of Internet Explorer. I haven’t tested that with IE 6 SP 1, since I no longer have access to that version!

— Jimmy Cerra

Comment: #4

Jim’s revision for IE6 SP2 works in my copy of IE6 SP1. Not sure what interim patches I may have, but I’d guess that it should work for all IE6.

Jim’s demo does NOT work in Mozilla/Firefox. But he wasn’t targetting that, because he’s working on IE-specific problems, just as IE7 is. In Mozilla/Firefox, I think you can just use XMLHttpRequest::responseText.

Comment: #5

Loading CSS into memory via ActiveX seems a bit, well, “silly” to me, and potentially quite resource-intensive?

However, will it mean that the browser will actually assign .style properties to elements that have their CSS rules assigned by stylesheet only? I’ve just had to do a take on one of those old “loop through all of document.styleSheets and their rules, until you find one with the desired selector” procedures; except that I appended the matching rules’ style.cssText string to the element’s.

This worked for IE6 and Firefox — except that, of course, IE doesn’t assign element.style.cssText for properties in the inline style=”” attribute of an element; so I was limited to setting script-accessable rules by either method, but not both (and only in one stylesheet — and a single rule, it seems, too). Which isn’t _too_ bad; it’s just the opposite of what used to happen with older browsers, which is strange…

I’m a bit confused by all of this, having never really used XmlHttpRequest yet, or got the hang of it — or even worked with XML, in fact. Please explain what you mean by “load into memory” — surely you mean script memory; and surely that’s already sort-of covered by document.styleSheets anyway?

Comment: #6

trojjer, IE7 has to reload style sheets because Internet Explorer trashes style rules that it does not understand. CSS2/3 selectors are stored as UNKNOWN in the rules collection.

Comment: #7

Dean, I spent some time working on the problem of AJAX without ActiveX, and have a solution. Basically, you create an iframe loader. A working example of it is in my hack of the Sajax project

Feel free to rip out the iframe code and use it yourself.

Comment: #8

Kae – I’m not sure that iframes can be used to load style sheets. If you can work out how I’d be interested.