Javascript ile CSS değiştirme Değerleri
Kolay javascript ile satır içi CSS değerlerini ayarlamak için. Genişliği değiştirmek istiyorum ve bu gibi html varsa:
<div style="width: 10px"></div>
Yapmam gereken:
document.getElementById('id').style.width = value;
Satır içi stil değerleri değiştirecek. Normalde bu satır içi stil stil geçersiz kılar, çünkü bu bir sorun değil. Örnek:
<style>
#tId {
width: 50%;
}
</style>
<div id="tId"></div>
Bu Javascript kullanarak:
document.getElementById('tId').style.width = "30%";
Ben şu olsun:
<style>
#tId {
width: 50%;
}
</style>
<div id="tId" style="width: 30%";></div>
Bu sadece zaman ve Eğer ben önce genişliğine baktığımda içi değerleri değiştirmek istiyorum, çünkü bir sorun var:
<div id="tId"></div>
Döndürülen değer Null olur, eğer öyleyse ben Javascript bilmesine gerek genişlikte bir şeyler yapmak için bazı mantık (artış genişliğine göre 1'i değil, belirli bir değer), geri Boş zaman beklerim dize "P'si" yok gerçekten işe.
Yani benim soru: satır içi, nasıl bu değerler alabilir miyim? bulunan bir CSS stil değerleri var Nasıl ınline değerleri yerine stil değiştir, kimliği belirli miyim?
CEVAP
Tamam, effictively peticular tarzı tüm unsurları bir anda değiştirecek kadar global CSS değiştirmek istediğiniz gibi. Son zamanlarda kendimi Shawn Olson tutorial bunu nasıl öğrendim. Doğrudan onun kodu here başvuru yapabilirsiniz.
İşte özeti:
document.styleSheets
ile stylesheets alabilirsiniz. Aslında bu sayfa tüm stil bir dizi döndürür, ama document.styleSheets[styleIndex].href
özelliği ile hangi söyleyebilirim. Düzenlemek istediğiniz stil sayfası bulduğunuzda, kuralları bir dizi almak gerekir. Bu "" ve "" diğer birçok tarayıcıda. cssRules IE kuralları denir Ne olduğunu anlamanın yolları selectorText
özelliği gereğidir. Çalışan kod şöyle görünür:
var cssRuleCode = document.all ? 'rules' : 'cssRules'; //account for IE and FF
var rule = document.styleSheets[styleIndex][cssRuleCode][ruleIndex];
var selector = rule.selectorText; //maybe '#tId'
var value = rule.value; //both selectorText and value are settable.
Eğer herhangi bir hata görürseniz bana bu sizin için nasıl çalıştığını biliyorum ve yorum lütfen.
Google Chrome ayıklarken javascript de...
Nasıl JavaScript null değerleri kontro...
Değerleri değiştirme emri olmadan bir ...
Nasıl tüm özellikleri Javascript bir N...
C nasıl durduracağını# değerleri ile s...