✔ getElementsbyName in IE

A

andreasst

Mitglied
Mit der Funktion möchte ich CSS Eigenschaften im Document dynamisch ändern:
Mit folgenden Anforderungen:
- 0, 1 oder mehrere Tags, die durch einen Namen festgelegt werden.
- Festlegen der CssEigenschaft und des Wertes im Funktions aufruf
- unabhängig davon welcher Tag es ist

Im FireFox funktioniert das sehr gut. Leider im IE nicht.

kann mir wer helfen?
Code: 
function changeCSSValuebyName(objid,name,value)
 {
  var obj=document.getElementsByName(objid)[0]; 
	var i = 0;
	while(obj!= null)
	 {
		eval("obj.style."+name+"='"+value+"'");
		i++;
		obj=document.getElementsByName(objid)[i]; 
   }
 }
 
Hi,

im IE können nur Elemente über die Methode getElementsByName und somit über ihren Namen angesprochen werden,
die tatsächlich ein name-Attribut besitzen (z.B. A, IFRAME, FRAME, BUTTON).

Als Lösung könntest Du statt des name-Attributs einen Klassennamen verwenden, den Du zum Indentifizieren
verwendest.
Es werden alle Elemente des Dokumentes durchlaufen. Besitzt das aktuelle Objekt den gesuchten Klassenname,
so wird der CSS-Eigenschaftswert gesetzt.

Ein Beispiel:
Code: 
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
  "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>www.tutorials.de</title>
<meta name="author" content="Quaese">
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
<style type="text/css">
  <!--
div{ font-size: 1.4em;}
 //-->
</style>
<script type="text/javascript">
  <!--
function changeCSSValuebyName(strClassName, strCSS, strValue){
  // Alle Elemente des Dokumentes ermitteln
  arrTags = (navigator.userAgent.toLowerCase().indexOf("msie") != -1) ? document.all : document.getElementsByTagName('*');
  // Suchpattern
  eval("var strPattern = /"+strClassName+"\\b/");

  // Alle Elemente durchlaufen
  for(var i=0; i<arrTags.length; i++){
    // Fall der Klassenname dem Suchkriterium entspricht
    if(arrTags[i].className.match(strPattern)){
      // CSS-Eigenschaft setzen
      eval("arrTags["+i+"].style."+strCSS+"='"+strValue+"'");
    }
  }
}
 //-->
</script>
</head>
<body>
<button onclick="changeCSSValuebyName('test', 'color', '#f00');">test</button>
<div class="tests"><span>Entspricht nicht dem Kriterium</span></div>
<div class="test">Entspricht dem Kriterium</div>
<div class="eins test">Entspricht dem Kriterium</div>
<div class="">Entspricht nicht dem Kriterium</div>
<div class="zwei  test drei">Entspricht dem Kriterium</div>
<div class="">Entspricht nicht dem Kriterium</div>
</body>
</html>
Ciao
Quaese
 
Noch ein Vorschlag ohne eval():
Code: 
function setStyleValueByName(elemName, propName, propValue)
{
	var elems = document.getElementsByName(elemName);
	if( elems.length <= 0 ) {
		return false;
	}
	for(var i=0; i<elems.length; i++) {
		elems[i].style[propName] = propValue;
	}
	return true;
}
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück