Как улучшить меню переключения с помощью CSS и JavaScript?

#javascript #css

Вопрос:

Я реализовал функциональное меню глав(слева) и блоков(справа), которое работает так, как я хочу, и видно на прикрепленном изображении. Проблема в том, что это происходит медленно, так как я динамически генерирую CSS и JavaScript, чтобы определить правильные идентификаторы для каждого элемента.

введите описание изображения здесь

введите описание изображения здесь

введите описание изображения здесь

введите описание изображения здесь

Комментарии:

1. Я не читал весь код, но вы, похоже, выполняете много запросов к базе данных, что требует времени, большего, чем время, необходимое для динамической генерации Javascript и CSS. Попробуйте уменьшить количество SQL — запросов.

2. Хорошо, я понимаю, что вы говорите. Но я делаю так много запросов, потому что каждая глава и блок имеют уникальный идентификатор, который я могу получить только из базы данных.

3. Я это видел, но вы можете получить все необходимые данные из менуЧаптеров и менуНитов в двух запросах и сохранить данные в переменной PHP. Затем вы делаете все, что хотите, с этой переменной. Это явно лучше, чем выполнять SQL — запрос в каждом цикле.

Ответ №1:

Вы должны получить свои данные из базы данных все сразу:

Как насчет того, чтобы сделать это:

 SELECT menuChapters.id, menuUnits.id
FROM menuChapters INNER JOIN menuUnits
ON (menuChapters.id = menuUnits.chapter_id)
WHERE menuChapters.class=$get_class AND menuChapters.course=$get_course AND menuChapters.visibility=1
ORDER BY menuChapters.chapterOrder ASC, menuUnits.unitsOrder ASC
 

Это должно дать вам список, в котором у вас есть идентификатор вашей главы и идентификатор вашего подразделения для каждой строки.

Я не пробовал код, так что у него могут возникнуть некоторые проблемы.

Комментарии:

1. @алекс Рад, что это помогло. Не стесняйтесь хранить данные в переменных, когда это может быть полезно несколько раз: например, за исключением случаев, когда я ошибаюсь, $sql_dyn_1 и $sql_dyn_3a они точно такие же.