Ответы пользователя по тегу JavaScript
  • Как научиться понимать работу js в браузере?

    dhs
    @dhs
    Web-разработчик
    Когда-то и я столкнулся с этим вопросом лицом к лицу. В тот момент я решил обратиться к основам работы браузера. На Хабре есть статьи на эту тему, причем их немало, которые мне помогли вникнуть в суть происходящего. Далее я начал изучать инструменты разработчика. Сам я использую Chromium с его Chrome Dev tools от Google, разумеется, вам нужно использовать тот инструмент, который вам больше нравится, т.к. нет никакой разницы что использовать. Есть разница, как это использовать. Немного освоившись, я принялся дебажить свой же код. Иногда в ход шли реальные работы, а иногда, код написанный специально для этого. Самый эффективный пример, который мне понравился, это to do list, который я написал специально для этих целей. В интернет, to do list является самым популярным примером не просто так - это достаточно простой, но гибкий пример, на котором можно строить задачи как для новичков, так и для проффи. Знания, которые я получил этой практикой мне пригодились не сразу, но зато к месту. Спустя время, я начал осознавать, что мне стало проще ковыряться в чужом коде, и вот тогда я понял, что изучение основ и практика не прошли даром. Повторюсь, что когда-то я задал такой же вопрос, а ответ на него пришел сам собой спустя годы изучения и практики. Я считаю, что вам нужно, просто, больше практиковаться и тогда не вы будете задавать вопросы, а вам. Успехов вам. Надеюсь, что мой недоответ немного вам поможет.
    Ответ написан
    1 комментарий
  • JS - на чем проще сделать десктопное приложение?

    dhs
    @dhs
    Web-разработчик
    Поделюсь личным опытом, а что выбрать - решать вам. В 2018 году написал два приложения на Electron и не испытал какого-либо дискомфорта. Писал на React, а использовал electron forge - это некая готовая сборка для разработки. Но после того как закончил проект, заметил, что есть electron boilerplate и он мне показался удобней, чем forge. Ссылка на boilerplate https://github.com/electron-react-boilerplate/elec...
    Ссылка на forge https://electronforge.io/templates
    Ответ написан
    Комментировать
  • Каков путь JS разработчика?

    dhs
    @dhs
    Web-разработчик
    Лично по своему опыту скажу, что надо начинать с native javascript, попутно поглядывая в сторону различных фреймворков и библиотек для того, чтобы не отставать от общественного мнения. Если вы освоите наивный js, то вникнуть, например в React js для вас не составит труда и займет не больше 2-4 недель (по своему опыту). Иными словами, если вы выучите русский язык, то и стихотворения учить будет не так сложно, против того, как если бы вы учили стих на неизвестном для вас языке. Думаю, вы поняли что я хотел донести.
    Ответ написан
    Комментировать
  • Чистый JavaScript или jQuery для работы с html/css файлами?

    dhs
    @dhs
    Web-разработчик
    На мой взгляд, анимировать лучше при помощи css - более производительно, а запускать и/или останавливать анимацию при помощи добавления/удаления к элементу какого-нибудь css класса.

    Например, чтобы запустить анимацию на странице, можно в нужный момент добавить контейнеру или объекту класс типа "-animation-active", и далее руководствоваться css для анимирования элемента. Если это решает вашу задачу, то лично я не вижу необходимости тянуть jQuery ради одной строчки кода, которая реализуема и без него.

    Изначально, если обратиться к истории возникновения jQuery, он был написан для кроссбраузерности, а после уже оброс всякими плюшками и удобствами. Иными словами, jQuery действительно полезная и удобная штука, но только там, где он действительно нужен. Выбирайте инструмент исходя из задачи, а не наоборот.
    Ответ написан
    Комментировать
  • В каком направлении искать информацию для того, чтобы научиться разрабатывать графические редакторы?

    dhs
    @dhs
    Web-разработчик
    Какой инструмент выбрать - решать только вам. Для начала, я бы начал изучать работу браузеров: как они рендерят страницу и все такое (одна из статей на тему - https://habrahabr.ru/post/224187/)
    Потом, я бы принялся за углубленное изучение SVG, чтобы определиться с выбором между SVG или DOM.
    Ответ написан
    Комментировать
  • Как упростить код jquery?

    dhs
    @dhs
    Web-разработчик
    Попробуйте что-то в этом роде (код не проверял):
    $(function() {
      $('select').change(function () {
          // get select natural index
          var index = $(this).index() + 1;
         
         $('.b-price-item-' + index).hide();
          $('#' + $(this).val()).show();
      });
    });
    Ответ написан
  • Как запустить событие в JavaScript или имитировать ввод текста?

    dhs
    @dhs
    Web-разработчик
    Если я правильно понял суть вопроса, попробуйте вызывать события таким способом:
    var evt = document.createEvent('HTMLEvents');
    evt.initEvent("change", true, true);
    textarea[i].dispatchEvent(evt);
    Ответ написан
    2 комментария
  • Почему скрипт срабатывает только после перезагрузки?

    dhs
    @dhs
    Web-разработчик
    Мне кажется, что до момента начала работы скрипта необходимо полностью прогрузить все фотографии. Т.е. сначала идет полная загрузка фотографий, а потом уже старт скрипта. А то что все работает после перезагрузки - просто второй раз браузер "достает" картинки из кэша. Если картинка не загружена или загружена не полностью, то скрипт не может определить размер изображения.
    Ответ написан
    Комментировать
  • Как поймать изменения в input без фокуса?

    dhs
    @dhs
    Web-разработчик
    Раз уж без JavaScript не решить задачу, то я бы, для таких целей, записывал бы данные не в скрытый инпут, а в объект. Ну и следил бы за объектом, например, через watch (Stackoverflow)
    Ответ написан
    5 комментариев
  • Как сделать при выполнении Ajax, спуск модального окна?

    dhs
    @dhs
    Web-разработчик
    чтобы форма не закрывалась, ваш код должен возвращать "false", в противном случае, при возвращении "true" происходит реальная отправка формы.
    попробуйте либо так:
    $('#form').submit(function(){
        var form_data = $(this).serialize();
        // ....
        return false;

    либо так:
    $('#form').submit(function(evt){
        evt.preventDefault();
        // ....

    Чтобы не расписывать здесь мануалы по JavaScript, почитайте статьи на тему отправки HTML форм.
    Ответ написан
    Комментировать
  • Как называется эта анимация или где найти ее css / js?

    dhs
    @dhs
    Web-разработчик
    Вот, набросал что-то подобное. Думаю, для примера вам подойдет codepen.io/dhs/pen/zBYYJq
    Ответ написан
    Комментировать
  • Как загрузить изображение на сервер?

    dhs
    @dhs
    Web-разработчик
    Без диалога выбора файла ни как - такова политика безопасности пользователя со стороны браузера. Минимальная процедура загрузки файла - это:
    1. Клик по кнопке, например, "Загрузить файл"
    2. Выбор файла в диалоге выбора
    Ответ написан
    2 комментария
  • Как сгрупировать массив по date?

    dhs
    @dhs
    Web-разработчик
    var arr1 = [
    		{date:"2015-01-22", dog:1},
    		{date:"2015-01-22", cat:2},
    		{date:"2015-01-22", duck:3},
    		{date:"2015-01-22", duck:2},
    		{date:"2015-01-22", cat:3},
    		{date:"2015-01-22", dog:4}
    	],
    	arr2 = [];
    
    for (var i = 0; i < arr1.length; i += 1) {
    
    	if (arr2[arr1[i].date] && arr2[arr1[i].date].date) {
    		for (n in arr1[i]) {
    			if (n !== 'date') {
    				arr2[arr1[i].date][n] = (arr2[arr1[i].date][n]) ? arr2[arr1[i].date][n] + arr1[i][n] : arr1[i][n];
    			}
    		}
    	} else {
    		arr2[arr1[i].date] = arr1[i];
    	}
    
    }
    
    console.log(arr2);
    Ответ написан
    Комментировать
  • Существует ли хороший WYSIWYG для реализации следующих задач?

    dhs
    @dhs
    Web-разработчик
    Ответ написан
    Комментировать
  • Событие.on jquery в нативном javascript?

    dhs
    @dhs
    Web-разработчик
    document.addEventListener('click', function (event) {
        var selectors = document.querySelectorAll('____СЕЛЕКТОР____'),
            element = event.target,
            index = -1;
    
        if (selectors) {
    
            while (element && ((index = Array.prototype.indexOf.call(selectors, element)) === -1)) {
                element = element.parentElement;
            }
    
            if (index > -1) {
                (function () {
                    //РЕЗУЛЬТАТ СЮДА
                }).call(element, event);
            }
        }
    });
    Ответ написан
    Комментировать