getElementsByClassName IE özünürlük sorunu

Question

IE'de getElementsByClassName sorununu nasıl çözeceğinizi belirleyen sorunlar yaşıyorum. Robert nyman'ı en iyi nasıl uygularım (kodumdan sadece 1 tanesi olduğu için bağlantıyı gönderemiyorum) çözünürlüğümü koduma nasıl ekleyebilirim? Ya da jquery çözünürlüğü daha iyi olur mu? Benim kod

function showDesc(name) { 
var e = document.getElementById(name); 
//Get a list of elements that have a class name of service selected 
var list = document.getElementsByClassName("description show"); 

//Loop through those items 
for (var i = 0; i < list.length; ++i) { 
    //Reset all class names to description 
    list[i].className = "description"; 
} 

if (e.className == "description"){ 
    //Set the css class for the clicked element 
    e.className += " show"; 
} 
else{ 
    if (e.className == "description show"){ 
     return; 
    } 
}} 

ve ben/göstermek her hizmet (Chrome ve FF çalışır) için açıklama gizlemek için bu sayfadaki dev.msmnet.com/services/practice-management üzerine kullanıyorum. Herhangi bir ipucu çok takdir edilecektir.

Answer 1

Ben senin fonksiyonunun jQuery sürümü neye benzediğini görmek için meraklı, bu yüzden bu geldi:

function showDesc(name) { 
    var e = $("#" + name); 
    $(".description.show").removeClass("show"); 
    if(e.attr("class") == "description") { 
     e.addClass("show"); 
    } else if(e.hasClass("description") && e.hasClass("show")) { 
     return; 
    } 
} 

Answer 2

aşağıdaki ile getElementsByClassName() değiştirebilirsiniz:

function getbyclass(n){ 
    var elements = document.getElementsByTagName("*"); 
    var result = []; 
    for(z=0;z<elements.length;z++){ 
    if(elements[z].getAttribute("class") == n){ 
     result.push(elements[z]); 
    } 
    } 
    return result; 
} 

Sonra bu gibi kullanabilirsiniz:

getbyclass("description") // Instead of document.getElementsByClassName("description") 

Answer 3

Bu çoklu sınıfları desteklemelidir.

function getElementsByClassName(findClass, parent) { 

    parent = parent || document; 
    var elements = parent.getElementsByTagName('*'); 
    var matching = []; 

    for(var i = 0, elementsLength = elements.length; i < elementsLength; i++){ 

    if ((' ' + elements[i].className + ' ').indexOf(findClass) > -1) { 
     matching.push(elements[i]); 
    } 

    } 

    return matching; 

} 

DOM'da biraz daha hızlı arama yapmak için bir üst öğeyi de iletebilirsiniz.

sonra HTML <div class="a b c" /> maç şöyle değiştirmeyi denemek getElementsByClassName('a c') isterseniz ...

var elementClasses = elements[i].className.split(/\s+/), 
    matchClasses = findClass.split(/\s+/), // Do this out of the loop :) 
    found = 0; 

for (var j = 0, elementClassesLength = elementClasses.length; j < elementClassesLength; j++) { 

    if (matchClasses.indexOf(elementClasses[j]) > -1) { 
     found++; 
    } 

} 

if (found == matchClasses.length) { 
    // Push onto matching array 
} 

yalnızca bu işlev zaten mevcut değilse kullanılabilir olması istiyorsanız,

ile tanımını sarmak

if (typeof document.getElementsByClassName != 'function') { } 

Answer 4

Daha kolay jQuery çözüm: jQuery kullanıyorsanız

$('.service').click(function() { 
    var id = "#" + $(this).attr('id') + 'rt'; 
    $('.description').not(id).hide(); 
    $(id).show(); 
} 

Neden show sınıfla rahatsız?

Answer 5

HTMLElement.getElementByClassName() yöntemini uygulardım, ancak en azından Firefox ve Chrome, bu öğeler çok fazla olduğunda öğelerin yalnızca yarısını bulursam, bunun yerine bir şey kullanır (aslında daha büyük bir işlevdir):

getElmByClass(clm, parent){ 
    // clm: Array of classes 
    if(typeof clm == "string"){ clm = [clm] } 
    var i, m = [], bcl, re, rm; 
    if (document.evaluate) { // Non MSIE browsers 
     v = ""; 
     for(i=0; i < clm.length; i++){ 
     v += "[contains(concat(' ', @"+clc+", ' '), ' " + base[i] + " ')]"; 
     } 
     c = document.evaluate("./"+"/"+"*" + v, parent, null, 5, null); 
     while ((node = c.iterateNext())) { 
      m.push(node); 
     } 
    }else{     // MSIE which doesn't understand XPATH 
     v = elm.getElementsByTagName('*'); 
     bcl = ""; 
     for(i=0; i < clm.length; i++){ 
      bcl += (i)? "|":""; 
      bcl += "\\b"+clm[i]+"\\b"; 
     } 
     re = new RegExp(bcl, "gi"); 
     for(i = 0; i < v.length; i++){ 
     if(v.className){ 
      rm = v[i].className.match(bcl); 
      if(rm && rm.length){  // sometimes .match returns an empty array so you cannot use just 'if(rm)' 
       m.push(v[i]) 
      } 
     } 
     } 
    } 
    return m; 
} 

Ben RegExp (.indexOf ile belki bir işlev, bu test edilecek shuld) yavaş olduğu için, XPATH olmadan yineleme için daha hızlı bir yolu var olacağını düşünüyorum, ama iyi

Answer 6

ben koymak İşte tek çalışıyor birlikte, güvenilir ve muhtemelen en hızlısı. Herhangi bir durumda çalışmalı.

function $class(className) { 
    var children = document.getElementsByTagName('*') || document.all; 
    var i = children.length, e = []; 
    while (i--) { 
     var classNames = children[i].className.split(' '); 
     var j = classNames.length; 
     while (j--) { 
      if (classNames[j] == className) { 
       e.push(children[i]); 
       break; 
      } 
     } 
    } 
    return e; 
}