Форум программистов, компьютерный форум, киберфорум
jQuery
Войти
Регистрация
Восстановить пароль
Блоги Сообщество Поиск  
 
 
Рейтинг 4.80/5: Рейтинг темы: голосов - 5, средняя оценка - 4.80
 Аватар для Mailo
178 / 226 / 31
Регистрация: 18.02.2010
Сообщений: 2,313

Смена фавикона по событию

22.10.2024, 18:32. Показов 1837. Ответов 28
Метки нет (Все метки)

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

JavaScript
1
2
3
4
5
6
if ($(".wrapper").hasClass(".light")) {
  <link rel="shortcut icon" href="favicon.svg" type="image/svg">
},
else if ($(".wrapper").hasClass(".dark")) {
  <link rel="shortcut icon" href="favicon_dark.svg" type="image/svg">
}
0
cpp_developer
Эксперт
20123 / 5690 / 1417
Регистрация: 09.04.2010
Сообщений: 22,546
Блог
22.10.2024, 18:32
Ответы с готовыми решениями:

Смена фавикона
Здравствуйте. Написан небольшой чат на node.js Необходимо, когда пользователь находится в браузере не на той вкладке, где чат, поменять...

Смена цвета ячейки по событию OnClick
Как сделать тоже самое только по событию ONCLICK т.е. чтобы ОДНА ячейка выделялась при клике и оставалась выделенной, пока не кликнут по...

Смена контрола по событию
Мои господины, помогите, пожалуйста. Есть главное окно, оно подгружает контент из контролов. При старте сразу грузиться один контрол....

28
 Аватар для voraa
1296 / 1280 / 190
Регистрация: 21.01.2024
Сообщений: 5,925
30.10.2024, 12:48
JavaScript
1
$("#favicon").href = "favicon.svg"
Ох уж этот jquery. Это же не ванила.
$("#favicon") - это не элемент DOM. Это объект jq. У него нет свойства href.

C jq надо
JavaScript
1
2
3
4
5
$("#favicon")[0].href = "favicon.svg"
//или
$("#favicon").get(0).href = "favicon.svg"
//или
$("#favicon").eq(0).prop('href', "favicon.svg")
1
 Аватар для Mailo
178 / 226 / 31
Регистрация: 18.02.2010
Сообщений: 2,313
30.10.2024, 15:28  [ТС]
Ага не заметил, спасибо. Всё заработало.
Ещё оказалось моя конструкция почемут не работала
JavaScript
1
$("#favicon")
ну хотяб
JavaScript
1
document.getElementById("favicon")
отработала.

Добавлено через 2 минуты
voraa, блин почаще надо страничку форума обновлять, быстрее бы косяк с $ нашёл, спасибо.

Добавлено через 2 часа 31 минуту
А как его в localStorage впихать с этим параметром href, вместо класса? Даже не знаю куда его пристроить и проверку на state тоже не понятно куда запихать?

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
//favicon
$(".hb_theme").click(function() {
  if ($(".wrapper").hasClass("dark")) {
    $(".favicon")[0].href = "favicon_dark.svg"
  }
  else if($(".wrapper").hasClass("light")) {
    $(".favicon")[0].href = "favicon.svg"
  }   
  const fav = "favicon.svg"
  localStorage.setItem('fav', fav)
}) 
 
const fav = localStorage.getItem('fav') ?? "favicon_dark.svg"
const fav_state = fav === "favicon.svg"
$(".favicon")[0].href = ("favicon.svg", fav_state)
$(".favicon")[0].href = ("favicon_dark.svg", !fav_state)
0
Заблокирован
30.10.2024, 15:44
Примерно так, если по умолчанию светлая тема
JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
//favicon
$(".hb_theme").click(function() {
  if ($(".wrapper").hasClass("dark")) {
    $(".favicon")[0].href = "favicon_dark.svg"
    localStorage.setItem('fav', 'dark')
 
  }
  else if($(".wrapper").hasClass("light")) {
    $(".favicon")[0].href = "favicon.svg"
    localStorage.setItem('fav', 'light')
  }     
  
}) 
 
const fav = localStorage.getItem('fav') ?? "light"
if(fav==='light')$(".favicon")[0].href = "favicon.svg"
else $(".favicon")[0].href = "favicon_dark.svg"
Добавлено через 1 минуту
И если айди favicon заменил на такой же класс)
1
 Аватар для Mailo
178 / 226 / 31
Регистрация: 18.02.2010
Сообщений: 2,313
30.10.2024, 15:55  [ТС]
О как, то что надо, оказывается я ещё вариантам условий кавычки зря ставлю, можно и без них оказывается.
0
Заблокирован
30.10.2024, 15:58
Цитата Сообщение от Mailo Посмотреть сообщение
О как, то что надо, оказывается я ещё вариантам условий кавычки зря ставлю, можно и без них оказывается.
Если это про фигурные кавычки, то в одну строку можно и без них. Если не ошибаюсь, так во всех си-подобных языках. Вернее, не в одну строку, а в одно выражение)
0
Эксперт JSЭксперт HTML/CSS
 Аватар для krvsa
3857 / 1740 / 432
Регистрация: 14.03.2022
Сообщений: 4,434
30.10.2024, 16:22
Цитата Сообщение от barabar Посмотреть сообщение
JavaScript
1
2
if(fav==='light')$(".favicon")[0].href = "favicon.svg"
else $(".favicon")[0].href = "favicon_dark.svg"
Вот так лаконичнее

JavaScript
1
$(".favicon")[0].href = fav==='light' ? "favicon.svg" : "favicon_dark.svg"
Добавлено через 2 минуты
Или вообще вот так...

JavaScript
1
$(".favicon")[0].href = `favicon${fav==='light' ? '' : '_dark'}.svg`
2
 Аватар для voraa
1296 / 1280 / 190
Регистрация: 21.01.2024
Сообщений: 5,925
30.10.2024, 17:45
А зачем лишнее значение в localStorage?
У вас уже вроде было значение для темы them в localStorage? Почему его не использовать, оно же тоже самое.
0
 Аватар для Mailo
178 / 226 / 31
Регистрация: 18.02.2010
Сообщений: 2,313
30.10.2024, 19:41  [ТС]
Да у меня тут уже коллекция из 3х, да пускай будет, вдруг отключить что то надо по быстрому. Там вроде в два разных ключа лезут значения, что может пойти нитак.

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
//theme swap
setTimeout(() => {
  $('body').show();
}, 0);
 
$(".hb_theme").click(function() {  
  $('.wrapper').toggleClass('light').toggleClass('dark')  
  const theme = $('.wrapper').hasClass('light')? 'light' : 'dark'
  localStorage.setItem('theme', theme)        
})
const theme = localStorage.getItem('theme') ?? 'light'
const state = theme === 'light'
$('.wrapper').toggleClass('light', state).toggleClass('dark', !state)
 
 
//favicon
$(".hb_theme").click(function() {
  if ($(".wrapper").hasClass("dark")) {
    $(".favicon")[0].href = "favicon_dark.svg"
    localStorage.setItem('fav', 'dark')
 
  }
  else if($(".wrapper").hasClass("light")) {
    $(".favicon")[0].href = "favicon.svg"
    localStorage.setItem('fav', 'light')
  }      
}) 
 
const fav = localStorage.getItem('fav') ?? "light"
if(fav==='light')$(".favicon")[0].href = "favicon.svg"
else $(".favicon")[0].href = "favicon_dark.svg"
 
 
//langs
$(".l_eng").click(function() {
  $('body').addClass('eng')  
  localStorage.setItem('lang', 'eng')
})  
$(".l_rus").click(function() {
  $('body').removeClass('eng') 
  localStorage.setItem('lang', 'ru')
}) 
 
const lang = localStorage.getItem('lang') ?? 'ru'
const lang_state = lang === 'eng'
$('body').toggleClass('eng', lang_state);
0
Заблокирован
30.10.2024, 21:22
Цитата Сообщение от Mailo Посмотреть сообщение
вдруг отключить что то надо по быстрому.
Зачем этот избыточный код? А отключить можно просто закоментить строку.
Я по понятным причинам проверить не могу, но примерно так:
JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
$(".hb_theme").click(function() {  
  $('.wrapper').toggleClass('light').toggleClass('dark')  
  const theme = $('.wrapper').hasClass('light')? 'light' : 'dark'
  localStorage.setItem('theme', theme) 
  $(".favicon")[0].href = theme==='light' ? "favicon.svg" : "favicon_dark.svg"
       
})
 
 
const theme = localStorage.getItem('theme') ?? 'light'
const state = theme === 'light'
$('.wrapper').toggleClass('light', state).toggleClass('dark', !state)
$(".favicon")[0].href = theme==='light' ? "favicon.svg" : "favicon_dark.svg"
 
 
//langs
$(".l_eng").click(function() {
  $('body').addClass('eng')  
  localStorage.setItem('lang', 'eng')
})  
$(".l_rus").click(function() {
  $('body').removeClass('eng') 
  localStorage.setItem('lang', 'ru')
}) 
 
const lang = localStorage.getItem('lang') ?? 'ru'
const lang_state = lang === 'eng'
$('body').toggleClass('eng', lang_state);
1
Надоела реклама? Зарегистрируйтесь и она исчезнет полностью.
raxper
Эксперт
30234 / 6612 / 1498
Регистрация: 28.12.2010
Сообщений: 21,154
Блог
30.10.2024, 21:22

Подсчитать общую сумму только по событию №1 или по событию №2
Добрый день. Подскажите пожалуйста, в базе имеются &quot;№ Событий&quot;, &quot;потери&quot; по этим событиям в денежнем эквиваленте и &quot;Общая сумма...

Добавление фавикона
Добрый день, обитатели чата. Подскажите ка мне, как добавить фавикон в интернет-магазин на битриксе. Инструкцию с пошаговым описанием я уже...

Отображение фавикона в ссылке watsapp
Добрый день! Хотим, чтобы ссылка на наш сайт, вставленная в ватсапп, имела кроме заголовка, дескрипшна еще и фавикон. Как например...

Вертикальная черта перед названием сайта после фавикона
Собственно, и весь вопрос - откуда эта черта и как ее убрать?

Смена ориентации страниц и смена колонтитулов при печати JavaScript
Можно ли с помощью JavaScript задать при печати ориентацию страницы и поменять колонтитулы?


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
29
Ответ Создать тему
Новые блоги и статьи
[golang] Конкурентный fetcher с ограничением максимального количества одновременных HTTP запросов.
alhaos 10.06.2026
Задача Реализовать конкурентный fetcher с ограничением максимального количества одновременных HTTP запросов. Сигнатура func Fetch(urls string, maxConcurrent int) Result Пример urls :=. . .
[golang] Состояние гонки (race condition)
alhaos 10.06.2026
Состояние гонки (race condition) Состояние гонки (Race Condition) — это ошибка, возникающая при одновременном доступе нескольких горутин к одним и тем же данным без должной синхронизации. При этом. . .
Взрослые отношения, и почему они не получаются
kumehtar 09.06.2026
Когда в детстве ребёнок не получает от родителей чего-то важного, он лишается не просто приятных переживаний, а основы для формирования определённых внутренних качеств и навыков. Если ребёнок не. . .
[golang] Worker Pool
alhaos 09.06.2026
Worker Pool Worker Pool — паттерн конкурентной обработки задач в Go. Суть: фиксированное количество горутин-воркеров читают задачи из общего канала и пишут результаты в общий канал результатов. . . .
[golang] Pipeline
alhaos 08.06.2026
Pipeline Pipeline — паттерн конкурентной обработки данных в Go. Суть: данные проходят через цепочку независимых стадий, каждая из которых работает в своей горутине и общается с соседями через. . .
Свет внутри себя
kumehtar 07.06.2026
Пусть это будет здесь lIs4oanZS9Y
Программа для com-порта
Uhbif79 05.06.2026
Всем привет, давно хотел изучить Qt, начинал, бросал, потом снова начинал. И сейчас вот смог написать свою первую программу. До этого имел опыт программирования микроконтроллеров, писал прошивки на. . .
Транскрипция 55-минутного видео через Whisper: WhisperDesktop облажался, спас Google Colab[
anaschu 01.06.2026
Понадобилось получить текст из свежезагруженного видео на YouTube. Казалось бы, задача на пять минут. Заняла полтора часа. Делюсь опытом — может кому пригодится последовательность решений. . . .
КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin
Copyright ©2000 - 2026, CyberForum.ru