6 
       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);

このコードはChrome/Firefoxで機能しますが、私のFroyo（2.3）およびJellybean（4.1）Androidデバイスのストックブラウザーは何も印刷しません。どうしたの？リンクのjsオンロードを実行できればいいのですが。私の場合、他の何かはハックになります。：/

問題はinnerHTMLではありません。必要に応じてアラートで試してください（自分の危険で）。

別の回答は、この機能をチェックすることについて言及しています

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

..しかし、これは両方のストックブラウザに当てはまります！wtfみんな？

4

1 に答える 1

4

Androidブラウザーは、要素の「onload」/「onreadystatechange」イベントをサポートしていません：http：//pieisgood.org/test/script-link-events/ただし
、次を返します。

"onload" in link === true

したがって、私の解決策は、userAgentからAndroidブラウザーを検出し、スタイルシートで特別なcssルールを待つことです（たとえば、「本体」の余白をリセットします）。
Androidブラウザではなく、「onload」イベントをサポートしている場合は、次のように使用します。

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();
}

デモ：http ：//codepen.io/malyw/pen/AuCtH

于 2014-01-21T09:28:13.060 に答える