Aus einem Array alles von " .divname{ " zu } suchen zum weiterverarbeiten

[infinity95]

Guten Tag jswelt,
Wie kann ich wen ich in Javascript ein Array (um genau zu sein einen CSS-Code) habe,
alles suche das nach folgenden Kriterien aufgebaut ist?:
.einbillibigername{ <--- ein Punkt oder eine Route, darauf folgt ein name und eine geschweifte öffnende klammer

bis zur } schließenden klammer.

Ich möchte im End-Effekt eine Art Reset dadurch erreichen,
das als Beispiel, wen über Javascript einige CSS-Dinge geändert wurden mit einem Klick alles auf die durch die CSS-Datei vorgegebenen Einstellungen zurückfällt ohne die Seite neu zu laden.

Ich würde mich über hilfe in form von Code-Schnippseln oder einfach nur Tipps sehr freuen.

Infinity

 

[rico2009]

AW: Aus einem Array alles von " .divname{ " zu } suchen zum weiterverarbeiten

Das Stichwort was du suchst heißt Regulärer Ausdruck, damit kannst du Dinge suchen, finden und verändern. In JS gibt es dann die Funktion .match() zum suchen bzw. replace oder search (JavaScript/Objekte/RegExp).

Leider kann ich dir aus Zeitgründen gerade keinen RegEx zusammen basteln, der genau das tut was du willst.

 

[kkapsner]

AW: Aus einem Array alles von " .divname{ " zu } suchen zum weiterverarbeiten

Die CSS-Datei zu parsen und dann alles neu per JS zu setzten ist sicherlich nicht der beste Weg, um dein Ziel zu erreichen.
Lass' das doch den Browser machen - der kann das besser. Also praktisch durch document.styleSheets durchiterieren, in jedem Stylesheet durch die cssRules durchiterieren, den selectorText prüfen und dann alle Eigenschaften von .style entsprechend setzen:

function resetCSS(){
	[].forEach.call(document.styleSheets, function(styleSheet){
		[].forEach.call(styleSheet.cssRules, function(cssRule){
			if (cssRule.selectorText){
				[].forEach.call(document.querySelectorAll(cssRule.selectorText), function(node){
					Object.keys(cssRule.style).forEach(function(cssProperty){
						node.style[cssProperty] = cssRule.style[cssProperty];
					});
				});
			}
		});
	});
}

Aber einen wirklichen Reset bekommst du damit nicht hin. Es können mit JS ja auch Eigenschaften gesetzt worden sein, die im CSS gar nicht spezifiziert sind.

Alternativ kannst du durch alle Nodes im DOM durchgehen und NODE.style.cssText = NODE.getAttribute("style"); machen... aber dann geht auch jede Formatierung, die ev. im window.onload durchgeführt wird, verloren.

PS: es heißt "beliebiger"...