当你在浏览器环境中使用CDN来加载chinese-calendar
库,并希望将当前日期从公历转换为农历,可以按照以下步骤操作:
- 在HTML文件中添加对
chinese-calendar
库的引用。 - 编写JavaScript代码来获取当前日期并将其转换为农历。
下面是一个完整的HTML文件示例,展示了如何使用CDN引用chinese-calendar
库,并在页面加载时显示当前的农历日期:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Current Lunar Date</title>
<!-- 引入 chinese-calendar 库 -->
<script src="https://unpkg.com/chinese-calendar@latest/dist/chinese-calendar.min.js"></script>
</head>
<body>
<h1>当前农历日期</h1>
<p id="lunar-date"></p>
<script>
const { Calendar } = window.chineseCalendar;
// 获取当前日期
const today = new Date();
const year = today.getFullYear();
const month = today.getMonth() + 1; // JavaScript的月份是从0开始的,所以需要加1
const day = today.getDate();
// 转换为农历日期
const lunarDate = Calendar.toLunar(year, month, day);
// 找到页面上的元素并显示农历日期
document.getElementById('lunar-date').innerText = `${lunarDate.lYear}年${lunarDate.lMonth}月${lunarDate.lDay}日`;
</script>
</body>
</html>
在这个示例中,我们首先在<head>
标签内通过<script>
标签引入了chinese-calendar
库。然后,在<body>
标签内的<script>
标签中编写了JavaScript代码,该代码获取当前日期,将其转换为农历,并将结果显示在页面上的<p>
元素内。
当打开此HTML文件时,浏览器会加载chinese-calendar
库,执行JavaScript代码,并在页面上显示当前的农历日期。注意,lunar-date
是用于显示农历日期的<p>
元素的ID。
评论