Форум

drakulawz · #31 (**permalink**) 07.09.2018, 12:28

Сообщение от рони

цикл each и для первого и для второго

Дайте разобраться с предыдущими функциями и методами!))

Мне понравился вариант Aetae, хоть сначала я его и не понял.

Вот, попробовал применить на ещё одном задании:

var a = $('a');

    /*первый вариант функции вывода ссылок;*/
    //    function sum() {
    //        for (var i = 0; i < a.length; i++) {
    //            $(a[i]).html($(a[i]).html() + '(' + a[i].href + ')');
    //        }
    //    }
    //    sum();

    /*второй вариант функции вывода ссылок;*/
    function sum() {
        $a = a;
        $a.append(function (i) {
            return '(' + a[i].href + ')'
        })
    }
    sum();

Скинул два варианта, первый явно бредовый какой-то вышел, с append по-красивее выходит.

Как сказал laimas, нефиг совать jq всюду и делать "гибриды"... Если уж делать на jq то правильно.

Благодарю всех участвующих за терпение и (особенно) примеры функций

. Только проблема в том, что из ваших ответов я задаюсь всё большим количеством вопросов

. Надеюсь, что в дальнейшем смогу получить на них ответы

.
Так то, я уже два месяца как мучаю этот javascript, толком так и не продвинулся. Всякие мелочи делаю, даже калькулятор нормальный сварганить немогу.

рони · #32 (**permalink**) 07.09.2018, 12:30

<!DOCTYPE html>

<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
  </style>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>

  <script>
$(function() {
    var $num = $(".p"),
        btn = $(".btn"),
    inp = $("input");
    btn.on({
        "click": sort
    });

    function sort() {
        var val = $.map($num, function(el) {
            return +el.textContent
        }).sort(function(a, b) {
            return a - b
        });
        inp.val(val)
    }
});
  </script>
</head>

<body>
<input type="text">
<div class="p">10</div>
<div class="p">0</div>
<div class="p">5</div>
<div class="p">-1</div>
<button class="btn">Sort</button>

<script>

</script>


</body>
</html>

Dilettante_Pro · #33 (**permalink**) 07.09.2018, 12:39

drakulawz,
А это что за танцы с бубнами?

var a = $('a');

        $a = a;
        $a.append(function (i) {

Зачем лишний мусор в программе? чтобы потом сложнее было разобраться?

рони · #34 (**permalink**) 07.09.2018, 12:40

Сообщение от drakulawz

По нажатию на кнопку запишите в конец каждого абзаца его порядковый номер.

<!DOCTYPE html>

<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
  body {
      counter-reset: num;
  }
  .num:after {
      counter-increment: num;
      content: ' 'counter(num);
  }

  </style>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>

  <script>
$(function() {
    var $num = $(".p"),
        btn = $(".btn");
    btn.on({
        "click": num
    });

    function num() {
        $num.addClass('num')
    }
});
  </script>
</head>

<body>
<div class="p">Первый</div>
<div class="p">Второй</div>
<div class="p">Третий</div>
<div class="p">Четвертый</div>

<button class="btn">num</button>

<script>

</script>


</body>
</html>

drakulawz · #35 (**permalink**) 07.09.2018, 12:50

Сообщение от Dilettante_Pro

num.html(function(){ arr.push(+this.innerHTML)});

Если я правильно понял, то num здесь взят как объект DOM, а не jq. И метод html к ней всё равно применим? А чтобы перебрать и добавить каждый из этих объектов, методом push, используется this.

Dilettante_Pro · #36 (**permalink**) 07.09.2018, 13:01

рони, так нечестно! Обман зрения! Ничего не дописывается!

<!DOCTYPE html>

<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
  body {
      counter-reset: num;
  }
  .num:after {
      counter-increment: num;
      content: ' 'counter(num);
  }


  </style>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>

  <script>
$(function() {
    var $num = $(".p"),
        btn = $(".btn"),
        tst = $(".test"),
        inp = $("input");
    tst.hide();
    btn.on({
        "click": num
    });
    tst.on({
        "click": test
    });
    function num() {
        $num.addClass('num');
        tst.show();
    }
    function test() {
        var arr = [];
        $num.each(function() { arr.push(this.innerHTML); });
        inp.val(arr);
    }
});
  </script>
</head>

<body>
<div class="p">Первый</div>
<div class="p">Второй</div>
<div class="p">Третий</div>
<div class="p">Четвертый</div>

<button class="btn">num</button>
<button class="test">test</button>
<input type="text">

<script>

</script>


</body>
</html>

Dilettante_Pro · #37 (**permalink**) 07.09.2018, 13:03

Сообщение от drakulawz

num здесь взят как объект DOM

Неправильно. Объект jQuery.

var num = $('.p')

Сообщение от drakulawz

чтобы перебрать и добавить каждый из этих объектов, методом push, используется this

Тоже неправильно.
Перебор выполняет num.html()
this - это конкретный элемент DOM из набора элементов объекта num, получаемый при переборе.

drakulawz · #38 (**permalink**) 07.09.2018, 13:12

Сообщение от Dilettante_Pro

А это что за танцы с бубнами?

Я чё-то подумал, что если не переобъявить эту переменную как jq объект оно работать не будет.

function sort() {
        var val = $.map($num, function(el) {
            return +el.textContent
        }).sort(function(a, b) {
            return a - b
        });
        inp.val(val)
    }

рони, с методом map мне ещё предстоит знакомство. Он создаёт новый масив в котором записаны функции по отношению к элементам массива num. В данном случаи оно создаёт массив цифр, так как в num у нас записаны цифры. Так? А такая запись не правильная была бы +el.text?

function num() {
        $num.addClass('num')
    }

Интересно

drakulawz · #39 (**permalink**) 07.09.2018, 13:23

Сообщение от Dilettante_Pro

Перебор выполняет num.html()

понял. Я думал, что html указывает только на то, что нужно взять из элементов DOM текст, а функцией уже идёт перебор и именно this указывает на то, что там есть несколько элементов которые нужно записать в новый массив методом push.

Dilettante_Pro · #40 (**permalink**) 07.09.2018, 13:26

drakulawz,

$a = a;

ничего не переобъявляет. Это две переменные одинакового типа и одинакового содержания. $ здесь ничего не значит.
Просто программисты для удобства - чтобы лучше видеть в тексте программы переменные с объектами jq и применять к ним соответствующие методы - зачастую используют $ в имени переменных.

Форум

Справочник

Discord чат

Курсы javascript