Допустим, у меня есть файл mylib.js , в котором я объявил некоторые функции для повторного использования в нескольких проектах, над которыми я работаю.

var mylib = function(s) {
    var x;

    var obj = {

        myLibrary(s){
            if (x) return x;
            return document.querySelector(s);
        },

        hide(){
            x.style.display='none';
            return this;
        },

        show(a=''){
            x.style.display=a;
            return this;
        }

    };

    x = obj.myLibrary(s);
    return obj;
};

Теперь, если у меня есть другой файл website.js , в котором я использую свою пользовательскую библиотеку JS. Например, некоторые из моих страниц содержат разделы, которые должны оставаться скрытыми при запуске, поэтому я дал им класс .hidden и применил это к моему файлу website.js :

mylib('.hidden').hide();

... он работает нормально, пока есть какие-либо элементы с классом .hidden , но на некоторых страницах, где этот файл также включен, таких классов не было бы, так что это на самом деле приводит к в конфликте, и консоль говорит мне: x равен нулю

В чем именно причина этого конфликта? Как я мог избежать такого конфликта?

0
RE666

2 ответа

Вам нужно проверить на null, чтобы функция x была равна нулю.

var mylib = function(s) {
    var x;

    var obj = {

        myLibrary(s){
            if (x) return x;
            return document.querySelector(s);
        },

        hide(){
            if(x) {
              x.style.display='none';
            }
            return this;
        },

        show(a=''){
            if(x) {
              x.style.display=a;
            }
            return this;
        }

    };

    x = obj.myLibrary(s);
    return obj;
};

mylib('.hidden').hide();
<div>Test</div>

попробуйте if (mylib ('. hidden'). length) mylib ('. hidden'). hide (); надеюсь, я правильно понял вопрос.

58584075