Javascript 在另一个类中查找一个类并执行一些浏览器操作

Javascript 在另一个类中查找一个类并执行一些浏览器操作,javascript,html,dom,getelementbyid,getelementsbyclassname,Javascript,Html,Dom,Getelementbyid,Getelementsbyclassname,我试图找到一个特定的类(profileCard),然后检查该类中是否有其他类(followStatus)。如果它里面有followStatus,我想单击profileCard类中的一个按钮。这是我的密码: var profileCard = document.getElementsByClassName('ProfileCard'); var unfollowButtons = profileCard.getElementsByClassName('button-text'); var foll

我试图找到一个特定的类(
profileCard
),然后检查该类中是否有其他类(
followStatus
)。如果它里面有
followStatus
,我想单击
profileCard
类中的一个按钮。这是我的密码:

var profileCard = document.getElementsByClassName('ProfileCard');
var unfollowButtons = profileCard.getElementsByClassName('button-text');
var followStatus = profileCard.getElementsByClassName('FollowStatus');

for (var i = 0; i < profileCard.length; i++) {
  if (followStatus[i] != null) {
    unfollowButtons[i].click();
  }
}
var profileCard=document.getElementsByClassName('profileCard');
var unfollowButtons=profileCard.getElementsByClassName('button-text');
var followStatus=profileCard.getElementsByClassName('followStatus');
对于(变量i=0;i

我想在Chrome中使用这个功能,只是简单地将它粘贴到控制台中,但代码似乎什么都不做:按钮从未被点击过。我的代码中的错误在哪里?我如何修复它?

的循环中使用方法更方便。profileCards
元素:

var profileCards = document.querySelectorAll('.ProfileCard');

for (var i = 0; i < profileCards.length; i++) {
    if (profileCards[i].querySelector('.FollowStatus')) {
        var button = profileCards[i].querySelector('.button-text');
        if (button) {
            button.click();
        }
    }
}
var profileCards=document.querySelectorAll('.ProfileCard');
对于(变量i=0;i
我建议编程某种类型的节点选择器或使用

请注意document.getElementsByClass名称在某些浏览器中不兼容。 这是我刚刚编程的一个节点选择器,它解决了这个问题

N$ = (function(){
    if (!Array.prototype.indexOf)
    {
      Array.prototype.indexOf = function(elt /*, from*/)
      {
        var len = this.length >>> 0;

        var from = Number(arguments[1]) || 0;
        from = (from < 0)
             ? Math.ceil(from)
             : Math.floor(from);
        if (from < 0)
          from += len;

        for (; from < len; from++)
        {
          if (from in this &&
              this[from] === elt)
            return from;
        }
        return -1;
      };
    }
    if (!window.getComputedStyle) {//IE
        window.getComputedStyle = function(el, pseudo) {
            this.el = el;
            this.getPropertyValue = function(prop) {
                var re = /(\-([a-z]){1})/g;
                if (prop == 'float') prop = 'styleFloat';
                if (re.test(prop)) {
                    prop = prop.replace(re, function () {
                        return arguments[2].toUpperCase();
                    });
                }
                return el.currentStyle[prop] ? el.currentStyle[prop] : null;
            }
            return this;
        }
    }

    var N$_CURRENT_EVENT_THIS = null;
    var DOM_N$ = function(selector){
        if(typeof selector == typeof ""){
            this.selector = selector;
            this.nodes = $prepare(this.selector);
            this.win = window;
            this.doc = document;
        }else if(typeof selector == typeof {}){
            this.selector = N$_CURRENT_EVENT_THIS.selector;
            this.nodes = $prepare(this.selector);
            this.win = window;
            this.doc = document;
        }


        this.getSelector=function(){

            return this.selector;
        };
        this.eachNode = function(func){
            var that = this;
            for (var i = 0; i < this.nodes.length; i++) {
                N$_CURRENT_EVENT_THIS = that;
                func(this.nodes[i]);
                N$_CURRENT_EVENT_THIS = null;
            };
        };
        this.css = function(attr, value){
            N$_CURRENT_EVENT_THIS = this;
            var attribute = "";
            if(attr.indexOf('-') !== -1){
                var split_attr = attr.split('-');
                for (var i = 0; i < split_attr.length; i++) {
                    if(i != 0)
                        attribute += split_attr[i].charAt(0).toUpperCase() + split_attr[i].slice(1);
                    else
                        attribute += split_attr[i].charAt(0).toLowerCase() + split_attr[i].slice(1);
                };
            }else{
                attribute = attr;
            }

            var properties = new Array();
            for (var i = 0; i < this.nodes.length; i++) {
                if(typeof value != 'undefined'){
                    this.nodes[i].style[attribute] = value;
                }
                properties.push(window.getComputedStyle(this.nodes[i], null).getPropertyValue(attr));
            };
            return properties;
        };
        this.addEvent = function(event_, func){
            var that = this;
            for (var i = 0; i < this.nodes.length; i++) {
                var node = this.nodes[i];
                var events = this.nodes[i].events || {};    
                if(node.addEventListener){
                    if((event_) in events){
                        node.removeEventListener(event_, events[event_], true);
                        var tmp___ = events[event_];
                        var tmp__ = function(){
                            this.bar = "hello";
                            N$_CURRENT_EVENT_THIS = that;
                            tmp___(node, event_);
                            func(node, event_);
                            N$_CURRENT_EVENT_THIS = null;
                        };
                        node.addEventListener(event_, tmp__, true);
                        events[event_] = tmp__;
                    }else{
                        var tmp__ = function(){
                            N$_CURRENT_EVENT_THIS = that;
                            func(node, event_);
                            N$_CURRENT_EVENT_THIS = null;
                        };
                        node.addEventListener(event_, tmp__, true);
                        events[event_] = tmp__;
                    }
                }else if(node.attachEvent){
                    var ie_event = 'on' + event_;
                    if(event_ in events){
                        node.attachEvent(ie_event, function(){
                            N$_CURRENT_EVENT_THIS = that;
                            func(node, event_);
                            events[event_](node, event_);
                            N$_CURRENT_EVENT_THIS = null;
                        });
                    }else{
                        node.attachEvent(ie_event, function(){
                            N$_CURRENT_EVENT_THIS = that;
                            func(node, event_);
                            N$_CURRENT_EVENT_THIS = null;
                        });
                    }
                    events[event_] = func;
                }
                this.nodes[i].events = events;
            }
        };
        this.removeEvent = function(event_){
            N$_CURRENT_EVENT_THIS = this;
            for (var i = 0; i < this.nodes.length; i++) {
                var node = this.nodes[i];
                var events = this.nodes[i].events || {};
                if(node.removeEventListener){
                    if((event_) in events){
                        node.removeEventListener(event_, events[event_], true);
                        events[event_] = null;
                    }
                }else if(node.detachEvent){
                    var ie_event = 'on' + event_;
                    if((event_) in events){
                        node.detachEvent(ie_event, events[event_]);
                        delete events[event_];
                    }
                }
            }
        };
        this.text = function(str){
            N$_CURRENT_EVENT_THIS = this;
            for (var i = 0; i < this.nodes.length; i++) {
                var node = this.nodes[i];
                node.innerHTML = '';
                node.appendChild(document.createTextNode(str));
            }
        };
        this.animate = function(func, from, to, speed){
            var nodes = this.nodes;
            var that = this;
            for (var i = 0; i < this.nodes.length; i++) {
                (function animate(func, from, to, speed, i){
                    if(from >= to){
                        N$_CURRENT_EVENT_THIS = that;
                        func(nodes[i], to);
                        N$_CURRENT_EVENT_THIS = null;
                    }else{
                        N$_CURRENT_EVENT_THIS = that;
                        func(nodes[i], from);
                        N$_CURRENT_EVENT_THIS = null;
                        setTimeout(
                            function(){
                                animate(func, from +1, to, speed, i);
                            }, speed
                        );
                    }
                })(func, from, to, speed, i);
            }
        };
        this.appendNode = function(tagname, innerHTML){
            for (var i = 0; i < this.nodes.length; i++) {
                var new_node = document.createElement(tagname);
                new_node.innerHTML = innerHTML;
                this.nodes[i].appendChild(new_node);
            }
        };
        this.removeNode = function(){
            for (var i = 0; i < this.nodes.length; i++) {
                this.nodes[i].parentNode.removeChild(this.nodes[i]);
            }
        };
        function $prepare(str){
            str = str.replace(/(\s+>\s+)/g,'>');
            str = str.replace(/(\s+)/g,' ');
            var str_ = str;
            var querys = str.split(/[\s\>]+/);
            var querys_des = Array();

            var ascender = new Array();
            for (var i = 0; i < str_.length; i++) {
                if(str_[i] == ">" || str_[i] == " "){
                    var tmp_ = (str_[i] == ">")? 'next_child' : 'ascended';
                    ascender.push( tmp_);
                }
            };
            var recognizes = new Array();
            for (var i = 0; i < querys.length; i++) {
                var asc_child = null;
                asc_child = ascender[i-1];
                var tmp_ = {
                    "selector": querys[i],
                    "i":i
                };
                recognizes[i] = recognize(querys[i]);
                if(i != 0){
                    tmp_["asc_child"] = asc_child;
                }else{
                    tmp_["base_selector"] = true;
                }
                querys_des.push(tmp_);
            };

            return $select(querys_des, recognizes);
        }
        function $select(querys_des, recognizes, parent_){
            var parents = parent_ || null;
            for (var i = 0; i < querys_des.length; i++) {
                if('base_selector' in querys_des[i]){
                    parents = recognizes[querys_des[i]['i']];
                }else if('asc_child' in querys_des[i]){
                    var cur_children = recognizes[querys_des[i]['i']];
                    if(querys_des[i]['asc_child'] == 'next_child'){
                        var compatible = compatible_children(parents, cur_children, querys_des[i]['asc_child']);
                        parents = compatible;
                    }else if(querys_des[i]['asc_child'] == 'ascended'){
                        var compatible = compatible_children(parents, cur_children, querys_des[i]['asc_child']);
                        parents = compatible;
                    }
                }
            };

            return parents;
        }

        function compatible_children(parents, children, type){
            var ret = new Array();
            for (var a = 0; a < parents.length; a++) {
                for (var b = 0; b < children.length; b++) {
                    if(type == 'next_child'){
                        if(parents[a] == children[b].parentNode){
                            if(ret.indexOf(children[b]) == -1)
                                ret.push(children[b]);
                        }
                    }else if(type == 'ascended'){
                        if(isin(parents[a], children[b])){
                            if(ret.indexOf(children[b]) == -1)
                                ret.push(children[b]);
                        }
                    }
                }
            }
            return ret;
        }

        function isin(parent, child){
            var child_ = child;
            var ret = new Array();
            while((child_ = child_.parentNode) && child_ != document.body){
                if(parent == child_){
                    return true;
                }
            }
            return false;
        }

        function recognize(str){
            var identifier = new Array();

            var id_ = false;
            var class_ = false;
            var dom_ = false;
            if(str.indexOf("#") >= 0){
                id_ = true;
                var tmp = str.split("#")[1];
                if(str.indexOf(".") >= 0){
                    identifier['ID'] = tmp.split(".")[0];
                }else{
                    identifier['ID'] = tmp;
                }
            }

            if(str.indexOf(".") >= 0){
                class_ = true;
                var tmp = str.split(".")[1];
                if(str.indexOf("#") >= 0){
                    identifier['CLASS'] = tmp.split("#")[0];
                }else{
                    identifier['CLASS'] = tmp;
                }
            }


            if(id_ && class_){
                if(str.indexOf("#") < str.indexOf(".")){
                    var tmp = str.split("#")[0];
                    if(tmp.length > 0){
                        dom_ = true;
                        identifier['DOM'] = tmp;
                    }
                }else{
                    var tmp = str.split(".")[0];
                    if(tmp.length > 0){
                        dom_ = true;
                        identifier['DOM'] = tmp;
                    }
                }
            }else if(id_){
                var tmp = str.split("#")[0];
                if(tmp.length > 0){
                    dom_ = true;
                    identifier['DOM'] = tmp;
                }
            }else if(class_){
                var tmp = str.split(".")[0];
                if(tmp.length > 0){
                    dom_ = true;
                    identifier['DOM'] = tmp;
                }
            }else{
                if(str.length > 0){
                    dom_ = true;
                    identifier['DOM'] = str;
                }
            }


            var x;
            if(class_){
                if(typeof document.getElementsByClassName !== 'function') {//Old browsers
                    x = document.body.getElementsByTagName("*");
                }else{
                    x = document.getElementsByClassName(identifier['CLASS']);
                }

            }else if(dom_){
                x = document.getElementsByTagName(identifier['DOM']);
            }else if(id_){
                x = document.body.getElementsByTagName("*");
                for (var i = 0; i < x.length; i++) {
                    if(x[i].getAttribute("id") != identifier['ID']){
                        delete x[i];
                    }
                };
            }

            var elements = new Array();


            for (var i = 0; i < x.length; i++) {
                if(id_ && class_){
                    if(x[i].getAttribute("id") == identifier["ID"] && x[i].getAttribute("class") == identifier["CLASS"]){
                        if(dom_){
                            if(x[i].tagName.toLowerCase() == identifier['DOM'].toLowerCase()){
                                elements.push(x[i]);
                            }
                        }else{
                            elements.push(x[i]);
                        }
                    }
                }else if(id_){
                    if(x[i].getAttribute("id") == identifier["ID"]){
                        if(dom_){
                            if(x[i].tagName.toLowerCase() == identifier['DOM'].toLowerCase()){
                                elements.push(x[i]);
                            }
                        }else{
                            elements.push(x[i]);
                        }
                    }
                }else if(class_){
                    if(x[i].getAttribute("class") == identifier["CLASS"]){
                        if(dom_){
                            if(x[i].tagName.toLowerCase() == identifier['DOM'].toLowerCase()){
                                elements.push(x[i]);
                            }
                        }else{
                            elements.push(x[i]);
                        }
                    }
                }else{
                    if(dom_){
                        if(x[i].tagName.toLowerCase() == identifier['DOM'].toLowerCase()){
                            elements.push(x[i]);
                        }
                    }else{
                        elements.push(x[i]);
                    }
                }

            };

            return elements;
        }
    }


    var selectors = new Array();
    return function(selector){
            var N$_new = new DOM_N$(selector);
            var N$_ = null;
            if(selectors.length > 0){
                for (var i = selectors.length - 1; i >= 0; i--) {
                    if(selectors[i].selector == selector){
                        var not_in = new Array();
                        for (var b = N$_new.nodes.length - 1; b >= 0; b--) {
                            if(selectors[i].nodes.indexOf(N$_new.nodes[b]) == -1){
                                not_in.push(N$_new.nodes[b]);
                            }
                        };
                        for (var a = not_in.length - 1; a >= 0; a--) {
                            if(selectors[i].nodes.indexOf(not_in[a]) == -1){
                                selectors[i].nodes.push(not_in[a]);
                            }
                        };
                        N$_ = selectors[i];
                        break;
                    }else{
                        N$_ = N$_new;
                        /*
                        if(N$_.nodes.length > 0){
                            selectors.push(N$_);
                        }*/
                    }
                };
            }else{
                N$_ = N$_new;
                if(N$_.nodes.length > 0){
                    selectors.push(N$_);
                }
            }
            return N$_;
    };
})();

你有什么问题?好吧,我想,我明白了。您必须在
document.getElementsByClassName('ProfileCard')
中选择一个元素。如果只有一张
档案卡,请尝试在其后面添加
[0]
。不,有多张档案卡。感谢您的反馈我觉得奇怪的是:您正在将其粘贴到控制台中,但第二行应该已经抛出了类似于此的错误:
TypeError:profileCard.getElementsByClassName不是函数
。你没注意到吗?@Xufox我现在真的把它变成了一个扩展。我写了一个清单和一个小background.js,所以我没有任何问题。但是我仍然找不到合适的配置文件来点击。因为它是Chrome,你可以依赖于
forEach
,所以:
Array.prototype.forEach.call(document.queryselectoral(.ProfileCard))、函数(card){if(card.querySelector(.FollowStatus”){var b=card.querySelector(.button text”);if(b){b.click();})更清晰:(嘎:缺少
。修正了。)为什么只使用Chrome,你可以在旧IE中使用Chrome事件,我只是想避免这种情况下的魔法,以免混淆OP。仅仅因为他们提到Chrome并希望在控制台中使用它。简单循环也很好。我尝试了上面的代码,但是我的浏览器出现了一个错误:“UncaughtTypeError:Cannotreadproperty'click'of null”哇,这是一些代码!非常感谢,我不熟悉javascript和jquery,所以我不太懂,但非常感谢您的反馈!:)没问题。在未来,我会将其作为一个库发布,但现在我需要添加更多功能。
N$('.ProfileCard .FollowStatus').addEvent('click', function(node_, event_){
     //Do something.
     //node_ is a native Node
});