2013-05-11 10 views
5

Czasami muszę znaleźć obliczoną wartość atrybutu HTML lang (język elementu). Używam jQuery. Na przykład w poniższym kodzie Chciałbym poznać komputerowej lang elementu <p> i spodziewałbym wartość he:Jak znaleźć obliczoną wartość atrybutu lang elementu w JavaScript?

<!DOCTYPE html> 
<html lang="en" dir="ltr"> 
    <head> 
     <meta charset="utf-8" /> 
     <title>lang test</title> 
    </head> 
    <body> 
     <div lang="ar"> 
      <div lang="he"> 
       <p>Hallo.</p> 
      </div> 
     </div> 
    </body> 
</html> 

Doing $('p').attr('lang') nic nie zwraca, prawdopodobnie dlatego, że element <p> nie ma własny atrybut języka.

Kod ten wydaje się zrobić dobry uczynek:

$('p').closest('[lang]').attr('lang') 

Czy to funkcjonalnie poprawne? Czy istnieje lepszy sposób na to w jQuery, w czystym JavaScript lub z inną biblioteką JavaScript?

Dziękuję.

+2

Myślę, że napisałeś najlepszą drogę. Oczywiście, jeśli często używasz jQuery w innym kodzie. – Novelist

+0

.prop() może być użyty zamiast .attr() –

Odpowiedz

1

Najprostszym sposobem jest napisanie funkcji rekurencyjnej:

function getLanguage(node) { 
    if(node.lang) { 
    return node.lang; 
    } else if(node.parentNode) { 
    return getLanguage(node.parentNode); 
    } else { 
    return undefined; 
    } 
} 

Recursion może być nieskuteczne w czasach, ale tutaj to chyba nie ma znaczenia.

Jeśli potrzebujesz informacji o różnych elementach w dokumencie bardzo często, wydajność może być istotna, a następnie możesz przejść przez całe drzewo dokumentów i dodać nową właściwość, wskazując "język obliczeniowy" do każdego węzła.

0

Ta wtyczka jQuery powinna wykonać zadanie. Rozważa tylko pierwszy element w obiekcie jQuery.

(function($) { 
    $.fn.lang = function() { 
     if (this.length) { 
      var node = this[0]; 
      while (node) { 
       if (node.lang) { 
        return node.lang; 
       } 
       node = node.parentNode; 
      } 
     } 
    }; 
})(jQuery) 

on powróci undefined jeśli nie lang atrybut zostanie znaleziony.

+0

Lol. Używasz jQuery, ale zapominasz o 'najbliższych' i selektorach jQ, jak w oryginalnym wpisie. Jesteś zabawny, koleś – Novelist

+0

@moredemons jQuery '[lang]' selektory atrybutów mogą nie działać, jeśli właściwość języka została dodana jako właściwość zamiast atrybutu. To zależy od tego, czy przeglądarka odzwierciedla właściwość w atrybucie. Chrome robi, nie wiem o innych przeglądarkach. W każdym razie byłoby to bardziej wydajne niż użycie selektora atrybutów. – Alnitak

+0

Hm .. To wygląda na uzyskanie pewności, prawda? – Novelist

Powiązane problemy