Сергей delphinpro

Потому что radio у вас — это NodeList
Его нужно обежать циклом и на каждую ноду повесить обработчик.

Почаще и повнимательнее читайте документацию: querySelectorAll()

Этих файлов не должно у вас быть в папке source вообще.
Вы должны установить данные пакеты в npm и отдельно обработать всех вендоров. Либо склеить их в общий файл, либо подключать по отдельности, либо еще как-то.

Если же вам хочется именно так, то проще будет положить их в отдельную папку и не заморачиваться с исключением.

По-моему, здесь оптимальным будет вариант выноса выпадашек в самый внешний контекст (в боди), позиционирование под плашкой джаваскриптом, и соответственно единый для них zindex, поверх всего.

https://gist.github.com/delphinpro/50f2c7b4589502b...

function triplets(str) {
    // \u202f — неразрывный узкий пробел
    return str.toString().replace(/(\d)(?=(\d\d\d)+([^\d]|$))/g, '$1\u202f');
}

Вычислите ширину полосы прокрутки и вместе с оверфлоу добавляйте такой же марджин справа.

Как вычислить джавасриптом ширину скроллбара гугл подскажет.

function prov(id_knopki){
  return jQuery.ajax({ // Будем возвращать deferred-объект
    type: "POST",
    url: "prov_prav_polz.php",   
    dataType:"text",
    data:{"id_knopki":id_knopki},
    cache: false,  
    // async:false, // это плохо, выкидываем
	// эти коллбеки тоже убериаем
    // success:function(response){
    //   alert(response);
    //   var result_add = response; 
    //   if(result_add=="1") { alert("Операция разрешена"); } else { alert("Операция запрещена"); }
    // },
    // error:function(xhr, ajaxOptions, thrownError){
    //   alert(thrownError); alert("Ошибка выполнения скрипта");
    // }
  })
  // Вместо коллбеков будем использовать функциональность deferred объектов
  .done(function(response){
    alert(response);
    var result_add = response; 
    if(result_add=="1") { alert("Операция разрешена"); } else { alert("Операция запрещена"); }
	return response; // Прокинем данные дальше, наружу
  })
  .fail(function(xhr, ajaxOptions, thrownError){
    alert(thrownError); alert("Ошибка выполнения скрипта");
  })
  ;
  // return result_add; // неправильно
}

$("#formsubmit").click(function() {
  var id_knopki = 100;
  prov(id_knopki)
    .done(function(response){
      if(response=="1") {  } else {  }
    });
});

как-то так оно вроде должно работать... я уж не помню насколько там deferred от промисов отличается.

$.when(prov(id_knopki)).done(function() {
if(result_add=="1") { ... } else { ... }
});

Чтобы это работало, функция должна возвращать тот самый deferred объект:
return $.ajax({...})

закон старый уже. насколько я помню, там не обо всех куках сказано. Служебные печеньки, необходимые для работы сайта вы можете писать не спрашивая разрешения и вне зависимости от согласия пользователя. Т.е. кука о том что пользователь запретил ставить куки является служебной и ее можно писать в любом случае. А разрешение вы спрашиваете на запись каких-то кук имеющих отношение с персональным данным или типа того, или рекламным, или еще каким-то для отслеживания пользователя (в т.ч. партнерская таргетированная реклама, плагины соц-сетей и т.п.). Главным образом закон нацелен на соблюдение приватности юзера.

Я писал собственное решение, это не сложно, в принципе.
Но есть и готовые jQuery плагины, например этот — 352media.github.io/flexMenu

В частных случаях можно обойтись без javascript.
Под частными случаями я подразумеваю меню, которое не будет часто изменяться, а при изменениях всегда есть возможность привлечь верстальщика для правок.
Суть проста — хардкодим медиазапросами.

Структура примерно такая

<ul>
  <li class="more">...</li>
  <li>item 1</li>
  <li>item 2</li>
  <li>item 3</li>
  <li>item 4</li>
  <li>item 5</li>
</ul>

.more изначально скрыт, при уменьшении ширины ставим брикпойнт, показываем .more абсолютом в конце меню, и также абсолютами позиционируем последние не помещающиеся пункты в столбик.
Эти пункты делаем скрытми и показываем их правилом ul:hover > li { display: block}
При большем уменьшении ширины, всё больше пунктов позиционируем в столбик.

Да, это не по феншую. Зато просто и работает. В определённых случаях может быть простым и быстрым решением проблемы.

Может просто перемешать массив чисел?

function shuffle( array ) {
  for(var j, x, i = array.length; i; j = parseInt(Math.random() * i), x = array[--i], array[i] = array[j], array[j] = x);
    return true;
}

var a = [1,2,3,4,5,6,7,8,9];

shuffle(a);

out.innerHTML = a.toString();

https://jsfiddle.net/uhhqben9/

UPDATE:

Все просто — функция перемешивает массив чисел.

Вот ваша функция:

function getRandom(min, max) {
  var arr = [];
  for (var i = 0; i < max; i++) {
    x = Math.floor(Math.random() * (max - min + 1)) + min;
    if (arr.indexOf(x)) {
      return;
    }
    else {
      arr.push(x);
    }
    return arr;
  }
}

Дорабатываем ее с использованием функции shuffle:

function getRandom(min, max) {
  // Получаем массив чисел из диапазона от min до max
  var arr = Array.from(Array(max - min + 1).keys(), x => x + min);
  // Перемешиваем
  shuffle(arr);
  // возвращаем перемешанный массив
  return arr;
}

И можем использовать для получения массивов неповторяющихся случайных чисел

var a = getRandom(3,15);

https://jsfiddle.net/uhhqben9/1/

.

(function( ) {
})();

Вот эта конструкция называется "анонимная самовызываемая функция".

То есть, тут два действия:
Объявление анонимной функции

function( ) {
}

и сразу ее вызов
()()
Первые скобки это синтаксический приём для вызова анонимной функции. Есть и другие методы. Например
+function(){}()
Вторые скобки - это собственно вызов функции и при необходимости передача параметра (обычный вызов же)

()(jQuery) — в параметре передается jQuery

function($){} — а тут этот параметр объявлен и используется

(function($){})(jQuery) — итого, объявили анонимную функцию, и вызвали ее, передав параметром объект jQuery

Например, доллар у вас используется другой библиотекой, пусть MooTools.
Тогда вы запускаете jQuery в безконфликтном режиме

jQuery.noConflict();

Это значит, что доллар использоваться не будет, и объект будет доступен только по ссылке jQuery.

Но для удобства вы можете использовать анонимную функцию и безопасно использовать внутри неё переменную доллара

(function($){
  $('.slider').slick();
})(jQuery);

Чтобы стало совсем понятно, конструкцию можно переписать без анонимной функции

var myFunc = function($){
 // some code
}

myFunc(jQuery);

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>Document</title>
</head>
<body>

  <h1 id="para1">Some text here</h1>
    
  <script>
    para1.innerHTML = "Man";
  </script>
</body>
</html>

<button onclick=openbox(1)>Toggle 1</button>
<button onclick=openbox(2)>Toggle 2</button>
<button onclick=openbox(3)>Toggle 3</button>

<div class="item" id="item1">item 1</div>
<div class="item" id="item2" hidden>item 2</div>
<div class="item" id="item3" hidden>item 3</div>

function openbox(id){
    var el = document.getElementById('item'+id);

    if(el.hidden){
      document.querySelectorAll('.item').forEach(item => item.hidden = true);
      el.hidden = false;
    }else{
      el.hidden = true;
    }
}

https://jsfiddle.net/utzr8edr/

.

https://codepen.io/delphinpro/pen/MGbgor

Есть ли какая-то библиотека для этого? Например, у которой были бы методы типа styles.addClass() или styles.editClass("background-color", "black")

Представьте, javascript без библиотек такое может
.classList.add()
.classList.remove()

Ну или банальный jquery

.addClass()
.removeClass()

В любой непонятной ситуации в первую очередь обращайтесь к документации
Но если вам лень, то:

Events: change and input.
Methods: select(), stepDown(), and stepUp().

Конкретно здесь проще, и я бы даже сказал, нужно сделать страницу на jquery =))

------------------------

Если же вас интересует как в принципе заменить jquery на vue, то постараюсь ответить.

1. Как и в случае jquery, ищем подключаем подходящий пакет. Например этот.

2. Аккордеон реализуется вручную парой строчек

<div>
  <h2 @click="toggle"></h2>
  <div v-if="stateOpen">
    Скрытое содержимое
  </div>
</div>

{
  data() {
    return {
      stateOpen: false,
    }
  },
  methods: {
    toggle(){
      this.stateOpen = !this.stateOpen;
    }
  }
}

Анимации раскрытия по вкусу, с помощью обёртки transition

3. Аналогично предыдущему пункту. 10 минут на реализацию.
4. Аналогично первому пункту.
5. Аналогично первому пункту.
6. Блин, ну тут то же самое =)) Мне нравится этот пакет: vue-form

Вот и всё. jQuery можно не подключать.

Есть такой грязный хак

<MyComponent :foo="bar">
  <div class="my-component">
    <h3>Разметка компонента, генерируемая сервером по старинке</h3>
  </div>
</MyComponent>

Сам компонент стандартно описан в vue файле. Разметка что внутри выведена, будет замещена рендером компонента.
Само собой тег MyComponent будет невалидным с точки зрения html, но зато и содержимое компонента будет отдано сервером. Ну и тот факт, что нужно делать двойную работу (дублирование шаблонов на клиенте и сервере), тоже печалит. Однако когда нет возможности/желания разворачивать полноценный SSR может быть приемлемым компромиссом.

Регистр имеет значение

Как сделать во все scss файлы автозапуск другого scss в nuxt?