Speakermen

Где найти много задач по Javascript?

нет смысла использовать реакт если вы к контенту обращаетесь через .querySelector вместо этого создайте хук useState храните в нем ваше значение и используйте переменную где хотите. При необходимых ситуациях можно и изменять это значение

пример создания и использования
const [ text, setText ] = React.useState('Text1');

<h3 className='text'>{text}</h3>

если нужно изменять просто напишите
setText('новый текст');

да и не помешало бы чтения документации секции хуков

Все делается довольно просто.

Но разве это не ужасно нечитаемо?

Зависит от правил установленных при разработке. Как по мне - вполне нормально.

if a % 2:
Это тоже самое, что и
if a % 2 == 1:
Ну или это
if a % 2 != 0:

Поскольку 1 в булево значениях это True, а первый вид условия отвечает всегда на True, как и другие в принципе

Поэтому решать лишь вам как записывать. В любом из вариантов это читабельно

Все три нормальные, используй какой нравится. Ничего из твоих примеров не является плохой практикой.

Потому что на момент присваивания DOM элемент не существует

Сделать массив:

const arr = [
  [      'author', 'Author - ' ],
  [        'name',      'Name' ],
  [ 'currentTime',     '00:00' ],
  [    'duration',     '00:00' ],
];

Который надо что? - правильно, перебрать, так или иначе:

for (const [ className, text ] of arr) {
  titleElement.appendChild(create({
    el: 'span',
    className,
    text,
  }));
}

// или

titleElement.append(...arr.map(n => create({
  el: 'span',
  className: n[0],
  text: n[1],
})));

// или, без всех этих ваших странных функций

document.querySelector('#root').innerHTML = `
  <div id="title">${arr.map(n => `
    <span class="${n[0]}">${n[1]}</span>`).join('')}
  </div>
`;

Использовать цикл

const els = [
    ["author", "Author - "],
    ["name", "Name"],
    ["currentTime", "00:00"],
    ["duration", "00:00"],
];

els.forEach(el => {
    titleElement.appendChild(
        create({
            el: "span",
            className: el[0],
            text: el[1],
        })
    );
})

2

const els = [
    { el: "span", className: "author",      text: "Author - " },
    { el: "span", className: "name",        text: "Name" },
    { el: "span", className: "currentTime", text: "00:00" },
    { el: "span", className: "duration",    text: "00:00" },
];

els.forEach( el => titleElement.appendChild( create(el) ) );

Update

А вообще это разнородные элементы. Зачем их по отдельности генерировать. Пусть будет один единственный элемент (компонент) - title. Gecnm у него будет шаблон, и пусть вы будете в этот шаблон передавать данные

function renderTitle (d) {
 return `
  <div class="title">
    <span class="currentTime">${d.time}</span>
    <span class="author">${d.author}</span> –
    <span class="name">${d.name}</span>
    <span class="duration">${d.duration}</span>
  </div>
  `;
}
xxx.insertAdjacentHTML('beforeend', renderTitle({
  author:   'Author - ',
  name:     'Name',
  time:     '00:00',
  duration: '00:00',
}));

недавно отвечал по этому поводу Почему переменная класса становится undefined при обращении из метода?

судя по переменной e могу предположить, что это обработчик события.

import { TMyClass } from './TMyClass';

const obj = new TMyClass;

addEventListener('click', obj.MyFunc.bind(obj))

или 

addEventListener('click', e => obj.MyFunc(e))

https://developer.mozilla.org/ru/docs/Web/JavaScri...
Вот здесь потеряли контекст player:.addEventListener("click", player.prevAudio)

например вот так

const x = {
  __construct: function (){},
  queryAll: function (){},
  queryOne: function (){}
};

Внутри HTML функцию не использовать. Можно отдать в шаблон только значения. Если хотите что-то выходящее за грани реального, тогда рекомендую изучить javascript и ajax.

Видимо есть настройка, которая убирает заголовок

Предполагается, что в первой строке CSV-файла идёт заголовок с именами колонок.

header: int, list of int, None, default ‘infer’
Row number(s) to use as the column names, and the start of the data. Default behavior is to infer the column names: if no names are passed the behavior is identical to header=0 and column names are inferred from the first line of the file, if column names are passed explicitly then the behavior is identical to header=None. Explicitly pass header=0 to be able to replace existing names. The header can be a list of integers that specify row locations for a multi-index on the columns e.g. [0,1,3]. Intervening rows that are not specified will be skipped (e.g. 2 in this example is skipped). Note that this parameter ignores commented lines and empty lines if skip_blank_lines=True, so header=0 denotes the first line of data rather than the first line of the file.

https://pandas.pydata.org/docs/reference/api/panda...

[Errno 2] No such file or directory: 'D:\\projects\\django2\\django2cpu.json'

у тебя просто путь к файлу не правильный, нет слеша .......django2\\cpu.json

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

удивительно что и 1 раз работает...

$("prev").addEventListener("click", prevMonth, false);
  $("next").addEventListener("click", nextMonth, false);

$("next") - Это что такое? Если следовать правилам, то это "next" это селектор по тэгу. Такого тега не существует.

Аааааа.... Вы решили а почему бы не сделать свою функцию, которая ищёт по id и не назвать её так же как jQuery, чтобы понятно это было только Вам...

Короче у Вас поиск по id который должен быть уникальным на странице.
Обработчик вешается только на первый элемент. Соответственно, работают только стрелочки первого месяца.
Исправляйте на поиск по классу.