feat: enhance date and time display with Chinese format; add search engine switcher

- Updated dateTime function to display date and time in Chinese format.
- Introduced setSearchEngine function to switch between Google and Baidu as search engines.
- Added event listener for search engine switching on click.
- Persisted selected search engine in localStorage for user preference.
- Changed weatherBalloon city ID to Beijing, China.
This commit is contained in:
hc
2025-10-21 16:30:52 +08:00
parent 605432f8c5
commit a0cf683699
4 changed files with 228 additions and 34 deletions
+73 -3
View File
@@ -1,7 +1,23 @@
function dateTime() {
const date = new Date();
let today = date.toDateString();
let time = date.toLocaleTimeString();
// 中文日期格式
const year = date.getFullYear();
const month = date.getMonth() + 1;
const day = date.getDate();
const weekDays = ['星期日', '星期一', '星期二', '星期三', '星期四', '星期五', '星期六'];
const weekDay = weekDays[date.getDay()];
const today = `${year}${month}${day}${weekDay}`;
// 中文时间格式
const time = date.toLocaleTimeString('zh-CN', {
hour12: false,
hour: '2-digit',
minute: '2-digit',
second: '2-digit'
});
document.getElementById('date-time').innerHTML = '<p id="date">' + today + '</p><p id="time">' + time + '</p>';
setTimeout(dateTime, 1000);
}
@@ -21,7 +37,61 @@ function weatherBalloon(cityID) {
});
}
function setSearchEngine(engine) {
const searchForm = document.getElementById('search-form');
const searchInput = document.getElementById('search-input');
const searchEngineSelector = document.getElementById('search-engine-selector');
const baiduIcon = searchEngineSelector?.querySelector('.baidu-icon');
const googleIcon = searchEngineSelector?.querySelector('.google-icon');
if (!searchForm || !searchInput || !searchEngineSelector || !baiduIcon || !googleIcon) {
return;
}
if (engine === 'google') {
searchEngineSelector.dataset.engine = 'google';
searchEngineSelector.setAttribute('aria-label', '当前搜索引擎:Google,点击切换至 Baidu');
searchEngineSelector.setAttribute('title', '当前:Google(点击切换至 Baidu');
searchForm.action = 'https://www.google.com/search';
searchInput.name = 'q';
baiduIcon.style.display = 'none';
googleIcon.style.display = 'block';
} else {
searchEngineSelector.dataset.engine = 'baidu';
searchEngineSelector.setAttribute('aria-label', '当前搜索引擎:Baidu,点击切换至 Google');
searchEngineSelector.setAttribute('title', '当前:Baidu(点击切换至 Google');
searchForm.action = 'https://www.baidu.com/s';
searchInput.name = 'wd';
baiduIcon.style.display = 'block';
googleIcon.style.display = 'none';
}
try {
localStorage.setItem('searchEngine', searchEngineSelector.dataset.engine);
} catch (error) {
// Ignore storage errors (e.g., disabled storage)
}
searchInput.focus();
}
function switchSearchEngine() {
const searchEngineSelector = document.getElementById('search-engine-selector');
const nextEngine = (searchEngineSelector?.dataset.engine || 'baidu') === 'baidu' ? 'google' : 'baidu';
setSearchEngine(nextEngine);
}
function traichu() {
dateTime();
weatherBalloon(1850147); //OpenWeather city ID
weatherBalloon(1816670); //OpenWeather city ID - Beijing, China
const selector = document.getElementById('search-engine-selector');
if (selector) {
selector.addEventListener('click', switchSearchEngine);
let savedEngine = null;
try {
savedEngine = localStorage.getItem('searchEngine');
} catch (error) {
savedEngine = null;
}
setSearchEngine(savedEngine === 'google' ? 'google' : 'baidu');
}
}