1

Выбираю несколько HTMLElementов и выполняю над ними действия, в данном случае присваиваю новый класс(CSS). Всё это, конечно, реализовано в jQuery, но нужно сделать именно самому.

function $() {
    var elements = [];
    for (var i = 0; i < arguments.length; i++) {
        var element = arguments[i];
        if (typeof element == "string")
            element = document.getElementById(element);
        if (typeof element == "array")
            elements.concat(element);
        elements.push(element);
    }
    elements.addClass = addClass;
    return elements;
}

function addClass(classStr) {
    for (i in this) {
        var classArray = i.className.split(" ");
        if (!inArray(classArray)) {
            classArray.push(classStr);
            this[i].className = classArray.join(" ");
        }
    }
}

function inArray(arr, value) {
    var i;
    for (i=0; i < arr.length; i++) {
        if (arr[i] === value) {
            return true;
        }
    }
    return false;
}

$("string1").addClass("underline");

Не работает, потому что $("string1") не возвращает значения. Но как тогда реализовать такое? Чтобы всем аргументам функции $() присваивалось значение класса?

2 ответа 2

2

Стоит учесть недочеты, на которые указал @metazet (Я имею ввиду идентификацию селектора по первому его символу: '#' - дальше идет ID'шник, '.' - дальше идет имя класса). А реализовать установку класса в строке

$("string1").addClass("underline");

достаточно просто, функция $("string1") должна вернуть объект-массив, реализующий метод addClass и включающий логику следующую логику - перебрать все элементы объекта-массива и вызвать addClass от каждого из них. В качестве прототипа(родителя класса) стоит выбрать класс Array, так как весьма часто встречаю строчки:

if ($("string1").length == 10) {...}
7
  • Во-первых, если даёте пример кода - так хоть адаптировали бы его под реальную ситуацию) Более уместно было бы if ($("string1").length > 1) {...} А вообще не вижу разницы Вашего ответа от моего, суть одна и та же. С уважением.
    – metazet
    18 июл 2011 в 6:32
  • Спасибо за ответ, примерно тоже я и сделал. К сожалению насчёт прототипа не совсем понял.. Разве можно добавить .prototype к типу Array, но при этом добавить его так, чтобы он, прототип, а точнее метод, использовался только в массивах, которые возвращаются $() функцией?
    – Spirit
    18 июл 2011 в 18:24
  • function myType() {return [];} myType.prototype.addClass = addClass; myElements = new myType(); Кажется понял, о чём вы говорили. Ещё раз спасибо за ответ: натолкнул на множество полезных мыслей.
    – Spirit
    18 июл 2011 в 18:36
  • @metazet, а вот мне надо именно if ($("string1").length == 10) {...} и никак иначе, на мой взгляд это бессмысленно замечание с вашей стороны. Суть частично одна и таже - вы не предлагали возвращать промежуточный прокси-объект, вы предлагали вручную в каждое место пихать $.each, которые, кстати, тормознее нежели нативные for в JS.
    – GLAGOLA
    18 июл 2011 в 20:17
  • @GLAGOLA, я имел ввиду, что почему длина равна именно 10ти? Моё предложение носило лишь рекомендательный характер, ведь случаи проверки на размерность==10 намного реже, чем вообще проверка массив это или нет. Думаю, здесь возникло недопонимание :)
    – metazet
    18 июл 2011 в 20:25
1

Не работает, потому что забыли символ точки или решетки, т.е. если string1 - класс, то нужно

$(".string1").addClass("underline");

а если string1 - id, то нужно вот так:

$("#string1").addClass("underline");

Учите матчасть ;) Ах да, а для присваивания класса всем объектам, можно сделать так(хотя и верхний вариант тоже должен работать, но наверняка утверждать не буду):

$(".string1").each(function(){
    $(this).addClass("underline");
});

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.