Як зрабіць гэты страшны яваскрипт файл «размова» з маёй старонкай або іншым файлам Jquery?

Я змагаўся, як вар'ят з JavaScript, што дазваляе бясконцай пракруткай ў Tumblr. Патэлефануеце мне, пачаткоўцу, але гэта адчувае, як стары адваротны дыназаўр у параўнанні з тым, што я прывык з JQuery.

Мае спробы зрабіць гэты сцэнар пагаварыць з маімі функцыямі jQuery або распазнаваць DOM элементы на старонцы апынуліся цалкам бескарыснымі. Бо гэта адзіны спраўны бясконцы сцэнар пракруткі для Tumblr там, я павінен жыць з гэтым.

Цяпер я хачу, каб дадаць лічыльнік, які з'яўляецца, калі ён загружаецца новы змест, і схаваць кок, калі гэта не так. А таксама, змяніць прелоадер да «канца паведамленняў» паведамленне, як толькі мы дасягнулі канца.

Below is the entire script, I'd love if someone could show me how to refer to DOM elements and or .classes and #ids in this page http://syndex.me

Edit: Калі ласка, не на сайце вы ўбачыце прелоадер, але гэта не «разумныя» гэта проста дзіваў прывязаны да канца старонкі.

var tumblrAutoPager = {
    url: "http://proto.jp/",
    ver: "0.1.7",
    rF: true,
    gP: {},
    pp: null,
    ppId: "",
    LN: location.hostname,
    init: function() {
        if ($("autopagerize_icon") || navigator.userAgent.indexOf('iPhone') != -1) return;
        var tAP = tumblrAutoPager;
        var p = 1;
        var lh = location.href;
        var lhp = lh.lastIndexOf("/page/");
        var lht = lh.lastIndexOf("/tagged/");
        if (lhp != -1) {
            p = parseInt(lh.slice(lhp + 6));
            tAP.LN = lh.slice(7, lhp);
        } else if (lht != -1) {
            tAP.LN = lh.slice(7);
            if (tAP.LN.slice(tAP.LN.length - 1) == "/") tAP.LN = tAP.LN.slice(0, tAP.LN.length - 1);
        } else if ("http://" + tAP.LN + "/" != lh) {
            return;
        };
        var gPFncs = [];
        gPFncs[0] = function (aE) {
            var r = [];
            for (var i = 0, l = aE.length; i < l; i++) {
                if (aE[i].className == "autopagerize_page_element") {
                    r = gCE(aE[i]);
                    break;
                }
            }
            return r;
        };
        gPFncs[1] = function (aE) {
            var r = [];
            for (var i = 0, l = aE.length; i < l; i++) {
                var arr = aE[i].className ? aE[i].className.split(" ") : null;
                if (arr) {
                    for (var j = 0; j < arr.length; j++) {
                        arr[j] == "post" ? r.push(aE[i]) : null;
                    }
                }
            }
            return r;
        };
        gPFncs[2] = function (aE) {
            var r = [];
            var tmpId = tAP.ppId ? [tAP.ppId] : ["posts", "main", "container", "content", "apDiv2", "wrapper", "projects"];
            for (var i = 0, l = aE.length; i < l; i++) {
                for (var j = 0; j < tmpId.length; j++) {
                    if (aE[i].id == tmpId[j]) {
                        r = gCE(aE[i]);
                        tAP.ppId = aE[i].id;
                        break;
                    }
                }
            }
            return r;
        };
        for (var i = 0; i < gPFncs.length; i++) {
            var getElems = gPFncs[i](document.body.getElementsByTagName('*'));
            if (getElems.length) {
                tAP.gP = gPFncs[i];
                tAP.pp = getElems[0].parentNode;
                break;
            }
        }

        function gCE(pElem) {
            var r = [];
            for (var i = 0, l = pElem.childNodes.length; i < l; i++) {
                r.push(pElem.childNodes.item(i))
            }
            return r;
        }
        if (!tAP.pp) {
            return;
        }
        sendRequest.README = {
            license: 'Public Domain',
            url: 'http://jsgt.org/lib/ajax/ref.htm',
            version: 0.516,
            author: 'Toshiro Takahashi'
        };

        function chkAjaBrowser() {
            var A, B = navigator.userAgent;
            this.bw = {
                safari: ((A = B.split('AppleWebKit/')[1]) ? A.split('(')[0].split('.')[0] : 0) >= 124,
                konqueror: ((A = B.split('Konqueror/')[1]) ? A.split(';')[0] : 0) >= 3.3,
                mozes: ((A = B.split('Gecko/')[1]) ? A.split(' ')[0] : 0) >= 20011128,
                opera: ( !! window.opera) && ((typeof XMLHttpRequest) == 'function'),
                msie: ( !! window.ActiveXObject) ? ( !! createHttpRequest()) : false
            };
            return (this.bw.safari || this.bw.konqueror || this.bw.mozes || this.bw.opera || this.bw.msie)
        }

        function createHttpRequest() {
            if (window.XMLHttpRequest) {
                return new XMLHttpRequest()
            } else {
                if (window.ActiveXObject) {
                    try {
                        return new ActiveXObject('Msxml2.XMLHTTP')
                    } catch (B) {
                        try {
                            return new ActiveXObject('Microsoft.XMLHTTP')
                        } catch (A) {
                            return null
                        }
                    }
                } else {
                    return null
                }
            }
        };

        function sendRequest(E, R, C, D, F, G, S, A) {
            var Q = C.toUpperCase() == 'GET',
                H = createHttpRequest();
            if (H == null) {
                return null
            }
            if ((G) ? G : false) {
                D += ((D.indexOf('?') == -1) ? '?' : '&') + 't=' + (new Date()).getTime()
            }
            var P = new chkAjaBrowser(),
                L = P.bw.opera,
                I = P.bw.safari,
                N = P.bw.konqueror,
                M = P.bw.mozes;
            if (typeof E == 'object') {
                var J = E.onload;
                var O = E.onbeforsetheader
            } else {
                var J = E;
                var O = null
            }
            if (L || I || M) {
                H.onload = function() {
                    J(H);
                    H.abort()
                }
            } else {
                H.onreadystatechange = function() {
                    if (H.readyState == 4) {
                        J(H);
                        H.abort()
                    }
                }
            }
            R = K(R, D);
            if (Q) {
                D += ((D.indexOf('?') == -1) ? '?' : (R == '') ? '' : '&') + R
            }
            H.open(C, D, F, S, A);
            if ( !! O) {
                O(H)
            }
            B(H);
            H.send(R);

            function B(T) {
                if (!L || typeof T.setRequestHeader == 'function') {
                    T.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded; charset=UTF-8')
                }
                return T
            }

            function K(X, V) {
                var Z = [];
                if (typeof X == 'object') {
                    for (var W in X) {
                        Y(W, X[W])
                    }
                } else {
                    if (typeof X == 'string') {
                        if (X == '') {
                            return ''
                        }
                        if (X.charAt(0) == '&') {
                            X = X.substring(1, X.length)
                        }
                        var T = X.split('&');
                        for (var W = 0; W < T.length; W++) {
                            var U = T[W].split('=');
                            Y(U[0], U[1])
                        }
                    }
                }

                function Y(b, a) {
                    Z.push(encodeURIComponent(b) + '=' + encodeURIComponent(a))
                }
                return Z.join('&')
            }
            return H
        }

        function addNextPage(oj) {
            if (oj.status == 404) {
                tAP.remainFlg = false;
                return;
            }
            var d = document.createElement("div");
            d.innerHTML = oj.responseText;
            var posts = tAP.gP(d.getElementsByTagName("*"));
            if (posts.length < 2) {
                tAP.rF = false;
                return;
            }
            d = document.createElement("div");
            d.className = "tumblrAutoPager_page_info";
            tAP.pp.appendChild(d);
            for (var i = 0; i < posts.length; i++) {
                tAP.pp.appendChild(posts[i]);
            }
            var footer = $("footer");
            footer ? footer.parentNode.appendChild(footer) : null;
            tAP.rF = true;
        }
        watch_scroll();

        function watch_scroll() {
            var d = document.compatMode == "BackCompat" ? document.body : document.documentElement;
            var r = d.scrollHeight - d.clientHeight - (d.scrollTop || document.body.scrollTop);
            if (r < d.clientHeight * 2 && tAP.rF) {
                tAP.rF = false;
                p++;
                sendRequest(addNextPage, "", "GET", "http://" + tAP.LN + "/page/" + p, true);
            }
            setTimeout(arguments.callee, 200);
        };

        function $(id) {
            return document.getElementById(id)
        };
    },
    switchAutoPage: function() {
        this.rF = !this.rF;
        var aE = document.getElementsByTagName('*');
        for (var i = 0, l = aE.length; i < l; i++) {
            if (aE[i].className == "tAP_switch") {
                aE[i].firstChild.nodeValue = this.rF ? "AutoPage[OFF]" : "AutoPage[ON]";
            }
        }
    }
};
window.addEventListener ? window.addEventListener('load', tumblrAutoPager.init, false) : window.attachEvent ? window.attachEvent("onload", tumblrAutoPager.init) : window.onload = tumblrAutoPager.init;
0
Добрае пытанне. Гэта не можа быць зроблена. Гэта Tumblr рэч (Tumblr Дзіўна, але яна мае шмат працаваць вакол, на жаль. Так што гэта адзіны скрыпт у сеткі прама цяпер, што дазваляе ваш Tumblr да бясконцай прагорткі.
дададзена аўтар RGBK, крыніца
Так, гэта непранікальная ці не так? Але тое, што я проста не магу зразумець, чаму я не магу проста сказаць гэтаму скрыпт нешта накшталт $ ( «theImage») зрабіць нешта (гэта значыць клас, у маёй старонцы). Я ведаю, што $ ( «X») фармат з'яўляецца JQuery, добра, але што эквівалентна для такога роду Javascipt? Ці можна на самой справе належаць да элементаў так лёгка ў JS? Можа быць, я не разумеючы нешта фундаментальнае тут? Акрамя таго, чаму JS не мае селектар класа? няма getElementbyClass. Здаецца вар'ятам мне. Як давайце зробім гэта так складана, як гэта магчыма! Viva JQuery.
дададзена аўтар RGBK, крыніца
Я паспрабаваў гэта, ён проста не ведае, што я буду Taling а. Гэта як калі б што-небудзь на старонцы, акрамя таго, Div id'ed «#autopagerize_page_element» нельга назваць наўпрост, а праз абстрактныя выразы. Я толькі Аблічча ведаць, чаму гэта не гуляе добра. Чаму я не магу проста пагаварыць непасрэдна з імёнамі ідэнтыфікатараў або класа?
дададзена аўтар RGBK, крыніца
Калі вы ўжо карыстаецеся JQuery, чаму б не выкарыстоўваць jQuery бясконцы скрутак убудова замест гэтага?
дададзена аўтар DA., крыніца
Цьфу. Tumblr. Я прызнаю, Tumblr выдатна ад агульнай UX пункту гледжання і хуткасці ўверх-бегу, але крыніца з'яўляецца балючым. (Не так хваравіта, як SharePoint, вы бачыце, але так, я спачуваю ... гэта не будзе прасцей за ўсё ўзламаць)
дададзена аўтар DA., крыніца
Я ненавіджу амаль кожнае імя зменнай там, за выключэннем tmpId і URL . Ну, а я .
дададзена аўтар Dave Newton, крыніца
@RGBK Вы можаце getElementById , або класа (ЭВ) .
дададзена аўтар Dave Newton, крыніца

1 адказы

Вы, магчыма, лепш поспехі здабываючы толькі біты Tumblr з сцэнарыя і пакласці іх у jQuery абалонкі вы больш знаёмыя. Ёсць куча рэчаў у "простым» JS, як падзеі DOM AJAX і выбар элементаў, якія з'яўляюцца шлях больш простым з каркасам JS (і гэта нават не лічачы, як прыцемненае бягучы сцэнар ... blergh!).

Ва ўсякім выпадку, калі б мне прыйшлося мінімальна змяніць гэты код, я б паспрабаваць дадаць круцёлку проста, перш чым ён выклікае SendRequest у watchScroll <код /> функцыя, і я хацеў бы паспрабаваць выдаліць яго ў пусканаладка addNextPage функцыі.

1
дададзена
Што вы маеце на ўвазе "гэта атрымаць поўны статус»? Калі ўсё, што вы хочаце гэта праверыць, калі выклік AJAX suceeded, то няма нічога, каб зрабіць (так як Lib ўжо робіць, што ў readyState == 4 часткі)
дададзена аўтар hugomg, крыніца
Дзякуючы missingno, я дам, што стрэл і вярнуцца да вас з некаторымі console.logs :-)
дададзена аўтар RGBK, крыніца
Я дадаў кансольныя часопісы, якія запускаюць у патрэбны час (дапамаглі вашыя парады там, дзякуй. Тым не менш, я паспрабаваў амаль кожны, калі заява гэта атрымаць «поўны» статут без шанцавання. Любыя ідэі, як атрымаць, што ? syndex.me (праверыць кансольных часопісы)
дададзена аўтар RGBK, крыніца
На жаль, для удакладнення, я хацеў бы ўвайсці «Канец старонкі, ніякіх дадатковых паведамленняў для загрузкі». Пасля таго, як я гэта console.logs страляніны ў патрэбны час, я магу затым пайсці далей і высветліць, як зрабіць, каб з'явіцца на фактычным месцы. Дзякуй!
дададзена аўтар RGBK, крыніца
Я б выказаць здагадку, што гэта будзе ў межах, калі (oj.status == 404) {які знаходзіцца ў функцыі addNextPage. Аднак гэта яшчэ не будучы заўважаным. Weird.
дададзена аўтар RGBK, крыніца