---
title: "Ändra stil på extern sida i frame?"
type: "forum-thread"
url: "https://www.webforum.nu/amne/javascript/87889-ändra-stil-på-extern-sida-i-frame"
topic: "JavaScript"
topic_url: "https://www.webforum.nu/amne/javascript"
author: "Jesper T"
published: "2003-10-07T11:56:33.000Z"
updated: "2003-10-08T14:32:47.000Z"
replies: 10
views: 317
page: 1
pages: 1
language: "sv-SE"
site: "webForum — webforum.nu"
rights: "Upphovsrätten till varje inlägg tillhör dess författare."
attribution: "Citera som: webForum, https://www.webforum.nu/amne/javascript/87889-ändra-stil-på-extern-sida-i-frame"
---

# Ändra stil på extern sida i frame?

## #1 — Jesper T, 2003-10-07T11:56Z

Går det på någe vis att ändra stil på en extern sida i en frame om man vet vad  elementklassen heter?

Ex. i framen så öppnas en sida med ett antal divar. Dessa har på denna sida en svart ram. Nu vill jag att ramen/arna skall förefalla röda i min frame.
(divarnas class är "divinfo")

Permalänk: https://www.webforum.nu/p/87889

## #2 — Palle, 2003-10-07T12:15Z

Jorå det går.
Nu ska vi se om jag förstod dig rätt.. ;) 

```
[red]<html>
<body>

<iframe src="frame.htm" name="foo"></iframe>
<p>
	<a href="javascript:void(parent.foo.bar.className='divinfo_red');">Röd ram</a> | 
	<a href="javascript:void(parent.foo.bar.className='divinfo');">Svart ram</a>
</p>

</body>
</html>[/red]
```

Iframe´n:

```
[red]<html>
<head>

	<style type="text/css">
		.divinfo { border: 1px solid #000; }
		.divinfo_red { border: 1px solid red; }
	</style>

</head>
<body>

	<div class="divinfo" id="bar">
		Hybrid-DNA-tekniken fick sitt genombrott 1953.
	</div>

</body>
</html>[/red]
```

Permalänk: https://www.webforum.nu/p/1179211

## #3 — Jesper T, 2003-10-07T12:22Z

Nästan....
Jag hade tänkt alla objekt med ett visst klassnamn och inte ett specifikt  id.
Dessutom så skulle det vara extra bra om styletaggarna låg på sidan med iframen.(kanske inte går)

Permalänk: https://www.webforum.nu/p/1179213

## #4 — Palle, 2003-10-07T12:36Z

Ok, det där är överkurs för mig. ;)

Ta en titt här kanske:
<http://www.webforum.nu/showthread.php?s=&postid=686211#post686211>

Permalänk: https://www.webforum.nu/p/1179219

## #5 — Jesper T, 2003-10-07T22:38Z

Någon med mer erfarenhet(läs jojoxx, peter s, mfl.) kanske kan svara på frågan om det överhuvud taget är möjligt. Så kanske jag kan lista ut resten.... :)

Permalänk: https://www.webforum.nu/p/1179610

## #6 — Jojoxx, 2003-10-08T05:43Z

Jag trodde du provade länken ovan :)

Har moddat exemplet lite:

```
<script type="text/javascript">
function getStyleClassByName(className){
	if(document.all){
		for(var styleSheet=0;styleSheet<foo.document.styleSheets.length;styleSheet++){
			for(var rule=0;rule<foo.document.styleSheets[styleSheet].rules.length;rule++){
				if(foo.document.styleSheets[styleSheet].rules[rule].selectorText=="."+className){ return foo.document.styleSheets[styleSheet].rules[rule]; }
			}
		}
	} else if(document.getElementById){
		for(var styleSheet=0;styleSheet<foo.document.styleSheets.length;styleSheet++){
			for(var rule=0;rule<foo.document.styleSheets[styleSheet].cssRules.length;rule++){
				if(foo.document.styleSheets[styleSheet].cssRules[rule].selectorText=="."+className){ return foo.document.styleSheets[styleSheet].cssRules[rule]; }
			}
		}
	}
	return null;
}
</script>
<a href="#" onClick="getStyleClassByName('minklass').style.color='blue';">Blå</a>
<iframe src="iframe.html" name="foo" width="400" height="300"></iframe>
```

Sidan "iframe.html" innehåller alltså en klass vid namn "minklass" som du ändrar egenskaper för. Jag har inte provat, men dokumenten måste antagligen ligga på samma domän för att du skall ha rättighet att ändra egenskaperna.

Permalänk: https://www.webforum.nu/p/1179642

## #7 — Jesper T, 2003-10-08T13:41Z

Ja, precis, jag fick "Åtkomst nekad" när jag testade med en extern sida. Men jag skall testa hur det blir om jag gör der på en och samma domän. 
Testade med: 

```
<a href="#" onClick="getStyleClassByName('divinfo').className='blueborder';">Blå</a>
```

 Men fick ett fel. Går det att göra samma sak på ett sätt som funkar?

Permalänk: https://www.webforum.nu/p/1179901

## #8 — Jojoxx, 2003-10-08T14:00Z

Mmm... men det är inte klassen som du vill byta namn på, utan ett elements klasstillhörighet, så då blir det;

```
onClick="parent.document.getElementById('divinfo').className='blueborder';"
```

"blueborder" måste vara en definierad klass i det dokumentet.

Permalänk: https://www.webforum.nu/p/1179911

## #9 — Jesper T, 2003-10-08T14:05Z

men....getElementById, då måste väl elementet ha ett specifikt id?
I annat fall skulle det funka görbra med "getStyleClassByName('minklass').style.color='blue';" om man kunde ändra ramfärgen istället för typsnittsfärgen.

Permalänk: https://www.webforum.nu/p/1179916

## #10 — Jojoxx, 2003-10-08T14:19Z

Visst. Använd **borderColor** istället för **color** :)

Permalänk: https://www.webforum.nu/p/1179928

## #11 — Jesper T, 2003-10-08T14:32Z

Jasså, det var inte svårare. :) 
Tack, igen då.
Det blev så här:

```
<script type="text/javascript">
function getStyleClassByName(className){
	if(document.all){
		for(var styleSheet=0;styleSheet<foo.document.styleSheets.length;styleSheet++){
			for(var rule=0;rule<foo.document.styleSheets[styleSheet].rules.length;rule++){
				if(foo.document.styleSheets[styleSheet].rules[rule].selectorText=="."+className){ return foo.document.styleSheets[styleSheet].rules[rule]; }
			}
		}
	} else if(document.getElementById){
		for(var styleSheet=0;styleSheet<foo.document.styleSheets.length;styleSheet++){
			for(var rule=0;rule<foo.document.styleSheets[styleSheet].cssRules.length;rule++){
				if(foo.document.styleSheets[styleSheet].cssRules[rule].selectorText=="."+className){ return foo.document.styleSheets[styleSheet].cssRules[rule]; }
			}
		}
	}
	return null;
}
function red(className){
getStyleClassByName(className).style.borderColor='blue';
getStyleClassByName(className).style.borderStyle='dotted';
}
</script>

<iframe src="iframe.html" name="foo" width="400" height="200"></iframe>
<p>

<a href="#" onClick="red('divinfo');">Blå, med prickar</a>
```

Permalänk: https://www.webforum.nu/p/1179936

---

Tråden på webben: https://www.webforum.nu/amne/javascript/87889-ändra-stil-på-extern-sida-i-frame
