Android stok tarayıcıları için bağlantı öğesinin yükleme kapasitesi neden güvenilir değil?

Question

 var style1 = document.createElement("link"); 
     style1.id = "rel"; 
     style1.rel = "stylesheet"; 
     style1.href = "http://www.mysite.com/css.css"; 
     style1.onload = function(){document.body.innerHTML+="fffffff";}; 
     document.getElementsByTagName("head")[0].appendChild(style1); 

Bu kod Chrome/Firefox'ta çalışıyor, ancak Froyo (2.3) ve Jellybean (4.1) Android aygıtlarımdaki stok tarayıcıları hiçbir şey yazdıramaz. Sorun ne? Bir bağlantının js yükünü kaldırabilir miyim? Benim durumumda başka bir şey bir hack için tutar. :/

Sorun, innerHTML değil. İsterseniz kendi uyarılarınızla uyarın.

Başka cevap bu hem stok tarayıcılarda doğrudur ..fakat

var huh = 'onload' in document.createElement('link'); 

yaparak bu işlevsellik için kontrol bahseder! Wtf çocuklar?

Answer 1

Android tarayıcı elemanı için "Onload"/"onreadystatechange" olayları desteklemez: http://pieisgood.org/test/script-link-events/
Ama döndürür:

"onload" in link === true 

Yani, benim çözüm beklemek ardından userAgent'taki gelen Android tarayıcı algılamak ve etmektir stil sayfanızdaki bazı özel css kuralı (ör. "body" kenar boşlukları için sıfırlama).
o Android tarayıcı değil ve biz kullanacağız event- "Onload" destekliyorsa:

var userAgent = navigator.userAgent, 
    iChromeBrowser = /CriOS|Chrome/.test(userAgent), 
    isAndroidBrowser = /Mozilla\/5.0/.test(userAgent) && /Android/.test(userAgent) && /AppleWebKit/.test(userAgent) && !iChromeBrowser; 

addCssLink('PATH/NAME.css', function(){ 
    console.log('css is loaded'); 
}); 

function addCssLink(href, onload) { 
    var css = document.createElement("link"); 
    css.setAttribute("rel", "stylesheet"); 
    css.setAttribute("type", "text/css"); 
    css.setAttribute("href", href); 
    document.head.appendChild(css); 
    if (onload) { 
     if (isAndroidBrowser || !("onload" in css)) { 
      waitForCss({ 
       success: onload 
      }); 
     } else { 
      css.onload = onload; 
     } 
    } 
} 

// We will check for css reset for "body" element- if success-> than css is loaded 
function waitForCss(params) { 
    var maxWaitTime = 1000, 
     stepTime = 50, 
     alreadyWaitedTime = 0; 

    function nextStep() { 
     var startTime = +new Date(), 
      endTime; 

     setTimeout(function() { 
      endTime = +new Date(); 
      alreadyWaitedTime += (endTime - startTime); 
      if (alreadyWaitedTime >= maxWaitTime) { 
       params.fail && params.fail(); 
      } else { 
       // check for style- if no- revoke timer 
       if (window.getComputedStyle(document.body).marginTop === '0px') { 
        params.success(); 
       } else { 
        nextStep(); 
       } 
      } 
     }, stepTime); 
    } 

    nextStep(); 
} 

Demo: http://codepen.io/malyw/pen/AuCtH