0xD34F

const wrapper = document.querySelector('.block');
const blockSelector = '.block_one';
const activeClass = 'active';

wrapper.addEventListener('mouseover', onHover);
wrapper.addEventListener('mouseout', onHover);

function onHover({ type, target }) {
  const block = type === 'mouseover' && target.closest(blockSelector);
  this.querySelectorAll(blockSelector).forEach(n => {
    n.classList.toggle(activeClass, !!block && n !== block);
  });
}

UPD. Наконец-то дождались, теперь можно без js задачу решить:

.block:has(.block_one:hover) .block_one:not(:hover) {
  /* сюда переносим стили того класса, который через js добавлялся */
}

Сначала <...> fetch() был прописан в methods

затем добавил <...> computed: - тогда ошибка появилась

Положите метод fetch где лежал.

Потому что кое-кто не в курсе, что бывает, когда выполняется установка значения необъявленной переменной.

Если переменной нет, она будет искаться во внешних областях видимости. И если ни в одной из внешних областей видимости переменной с таким именем нет, будет создана глобальная переменная. То есть, у вас при первом вызове popUp создаётся глобальная переменная elem_obj, а при последующих вызовах обновляется её значение.

Прежде чем реализовывать удаление, дадим пользователю возможность пометить задачу выполненной. Добавим в компонент задачи поддержку директивы v-model. Меняем имя параметра с task на value (или настраиваем model, если надо задать какое-то иное имя), а сам объект задачи заворачиваем в Proxy, который будет перехватывать установку значений свойств, собирать новый объект и отправлять его в родительский компонент:

computed: {
  task() {
    return new Proxy(this.value, {
      set: (target, prop, value) => {
        this.$emit('input', { ...target, [prop]: value });
        return true;
      },
    });
  },
},

И привязываем свойство done к чекбоксу (если кроме done надо редактировать ещё какие-то свойства - нет проблем, точно так же указываем их в v-model соответствующих полей ввода):

<input type="checkbox" v-model="task.done">

Теперь собственно удаление. В компоненте задачи добавляем кнопку, по клику на которую эмитим событие:

<button v-if="task.done" @click="$emit('delete')">delete</button>

В родительском компоненте подписываемся на это событие и удаляем задачу из массива:

<task-element
  v-for="(n, i) in todos"
  v-model="todos[i]"
  @delete="todos.splice(i, 1)"
></task-element>

https://jsfiddle.net/8g45pcx1/

document.querySelectorAll('.number').forEach(n => {
  n.innerText = n.innerText.replace(/\d+/g, m => (+m).toLocaleString());
});

или

for (const n of document.getElementsByClassName('number')) {
  n.textContent = n.textContent.replace(/\d(?=(\d{3})+(\D|$))/g, '$& ');
}

$headers = array_column($data[0]['pages'], 'name');
$columns = array_column($data[0]['pages'], 'attribute');
$rowCount = max(array_map('count', $columns));

$headersHTML = implode('', array_map(function($n) {
  return "<th>$n</th>";
}, $headers));

$rowsHTML = implode('', array_map(function($i) use($columns) {
  return "
    <tr>".implode('', array_map(function($n) use($i) {
        return "<td>".($n[$i] ?? '')."</td>";
      }, $columns))."
    </tr>";
}, range(0, $rowCount - 1)));

echo "
  <table>
    <thead>
      <tr>$headersHTML</tr>
    </thead>
    <tbody>$rowsHTML</tbody>
  </table>";

Используйте transition. Блоку, в который выводите значение переменной, назначаете key, равный этому значению. Изменится значение - блок нарисуется заново. Например.

fetch('https://api.novaposhta.ua/v2.0/json/', {
  method: 'POST',
  headers: {
    'Content-Type': 'application/json'
  },
  body: JSON.stringify({
    modelName: 'Address',
    calledMethod: 'getWarehouses',
    methodProperties: {
      CityName: document.querySelector('.myCityName').textContent,
    },
    apiKey: '',
  }),
})
  .then(r => r.json())
  .then(r => {
    document.querySelector('.mySelect').innerHTML = r.data
      .map(n => `<option>${n.Description}</option>`)
      .join('');
  });

setInterval(tesla.moveRight,30)

Контекст теряете, при вызовах moveRight значением this у него внутри будет вовсе не tesla.

Какие есть варианты исправления данного косяка:

1. Привязывать контекст при передаче метода в setInterval:
   
   setInterval(tesla.moveRight.bind(tesla), 30)
   
   
2. Передавать в setInterval не сам метод, а функцию-обёртку, где метод будет вызываться в правильном контексте:
   
   setInterval(() => tesla.moveRight(), 30)
   
   
3. Сделать Car классом, а метод moveRight объявить с использованием синтаксиса стрелочных функций:
   
   

   class Car {
     ...
   
     moveRight = () => {
       ...
     }
   }

   
   В этом случае привязка контекста будет выполнена автоматически при создании экземпляра класса, и вызов setInterval'а можно будет оставить в неизменном виде.
   
   

уберите атрибут for

Если ознакомиться с тем, что представляет собой свойство style, то можно узнать, что оно

используется для получения и установки инлайновых стилей

Вы пытаетесь получить инлайновый стиль? Нет. Ну и всё.

Используйте getComputedStyle.

работает он наоборот

потому что ^

когда нажимаю повторно чтобы остановить музыку, она не останавливается

При каждом вызове метода startAudio создаётся новый объект, play вызываете у одного, а pause у другого. Надо сохранять созданный audio между вызовами startAudio.

const result = arr
  .reduce((acc, n, i, a) => (
    a[i - 1] !== n && acc.push([ n, 0 ]),
    acc[acc.length - 1][1]++,
    acc
  ), [])
  .map(([ v, c ]) => c === 1 ? v : Array(c).fill(v));

или

const result = arr
  .reduce((acc, n, i, a) => (
    a[i - 1] === n || acc.push([]),
    acc[acc.length - 1].push(n),
    acc
  ), [])
  .map(n => n.length === 1 ? n[0] : n);

или

const result = arr.reduce((acc, n, i, a) => {
  const prev = n === a[i - 1];
  const next = n === a[i + 1];
  !prev && next && acc.push([]);
  (prev || next ? acc[acc.length - 1] : acc).push(n);
  return acc;
}, []);

Array.from({ length: 48 }, (n, i) => {
  const d = new Date(0, 0, 0, 0, 30 * i);
  return d.toLocaleTimeString('en-US', { hour: '2-digit', minute: '2-digit' });
})

Regex.Replace(str, "(?i)[^А-ЯЁA-Z]", "")

Добавьте модификатор u:

preg_match_all("/[а-я]{4,}/ui", $string, $keywords);

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

str.replace(/^https?:\/\/|\/$/g, '')