Javascript 编写活动日历的第一步，从哪里开始？

我正在自学一些核心web技术，主要是javascript、php和mysql。我想创建一个事件日历，将这3个事件联系在一起

---

我想我将用javascript绘制日历，然后使用php从mysql数据库添加事件。现在我想到的第一步是创建一个函数来绘制日历，然后我将使用document.write调用它。这是最符合逻辑的方法吗？

不，我建议您从考虑数据库开始。创建一个模式并创建数据库。然后，考虑您将使用并实现的所有服务（显示/添加/编辑/删除事件/用户…）。 当您的所有服务都得到很好的实现时，测试您的服务。为您的web应用程序编写代码

数据库

服务（php）

网络应用

---

这是我的意见，但我认为这是一个伟大的命令。

不，我建议您从考虑数据库开始。创建一个模式并创建数据库。然后，考虑您将使用并实现的所有服务（显示/添加/编辑/删除事件/用户…）。 当您的所有服务都得到很好的实现时，测试您的服务。为您的web应用程序编写代码

数据库

服务（php）

网络应用

---

这是我的意见，但我认为这是一个伟大的命令。

计划/编写日历的要求。它将做什么等等

首先从设计开始。仅使用HTML CSS JAVASCRIPT

然后按照SteamFire所说的计划数据库DB_模式

用php实现

---

只是一个宽泛的视图

计划/编写日历要求。它将做什么等等

首先从设计开始。仅使用HTML CSS JAVASCRIPT

然后按照SteamFire所说的计划数据库DB_模式

用php实现

只是一个广阔的视野

给你一个开始：

点击日期，您将看到所选的

样式更改


注意这取决于-JavaScript中处理日期/时间的基本库

样板HTML


太阳
周一
星期二
结婚
周四
星期五
坐


一些CSS

#日历{
列表样式类型：无；
填充：0；
保证金：0；
}
#日历里{
浮动：左；
宽度：13%；
利润率：01%1%0；
}
#日历里跨度{
显示：块；
填充物：5px；
背景色：#eee；
}
#日历li.选定的跨度{
字体大小：粗体；
文字装饰：下划线；
}
#日历李。今天跨度{
背景色：#33f；
颜色：白色；
}
#日历li.offset-0{左边距：0%；}
#日历li.offset-1{左边距：14%；}
#日历li.offset-2{左边距：28%；}
#日历li.offset-3{左边距：42%；}
#日历li.offset-4{左边距：56%；}
#日历li.offset-5{左边距：70%；}
#日历li.offset-6{左边距：84%；}

一点JavaScript

功能日历（要素、日期）{
//私有数据变量
var today=时刻（日期），
第一个=时刻（今天）。日期（1）；
//专用api
函数createDay（n）{
var li=document.createElement（“li”），
span=document.createElement（“span”）；
span.innerHTML=n；
李.儿童（span）；
返回李；
}
函数addDay（n）{
var li=createDay（n）；
如果（n==1）{
li.classList.add（“offset-”+first.day（））；
}
如果（n==today.date（））{
li.classList.add（“今天”）；
}
儿童元素（李）；
}
功能取消选择（li）{
如果（！li）返回；
li.classList.remove（“选定”）；
}
功能选择（li）{
取消选择（元素查询选择器（“.selected”）；
li.classList.add（“选定”）；
}
函数onClick（事件）{
选择（event.srcelelement.parentNode）；
event.preventDefault（）；
}
//初始化
对于（var i=1，days=today.daysInMonth（）；i您可以从这里开始：

点击日期，您将看到所选的
样式更改


注意这取决于-JavaScript中处理日期/时间的基本库

样板HTML


太阳
周一
星期二
结婚
周四
星期五
坐


一些CSS

#日历{
列表样式类型：无；
填充：0；
保证金：0；
}
#日历里{
浮动：左；
宽度：13%；
利润率：01%1%0；
}
#日历里跨度{
显示：块；
填充物：5px；
背景色：#eee；
}
#日历li.选定的跨度{
字体大小：粗体；
文字装饰：下划线；
}
#日历李。今天跨度{
背景色：#33f；
颜色：白色；
}
#日历li.offset-0{左边距：0%；}
#日历li.offset-1{左边距：14%；}
#日历li.offset-2{左边距：28%；}
#日历li.offset-3{左边距：42%；}
#日历li.offset-4{左边距：56%；}
#日历li.offset-5{左边距：70%；}
#日历li.offset-6{左边距：84%；}

一点JavaScript

功能日历（要素、日期）{
//私有数据变量
var today=时刻（日期），
第一个=时刻（今天）。日期（1）；
//专用api
函数createDay（n）{
var li=document.createElement（“li”），
span=document.createElement（“span”）；
span.innerHTML=n；
李.儿童（span）；
返回李；
}
函数addDay（n）{
var li=createDay（n）；
如果（n==1）{
li.classList.add（“offset-”+first.day（））；
}
如果（n==today.date（））{
li.classList.add（“今天”）；
}
儿童元素（李）；
}
作用
function init() {
  var cal = document.getElementById("calendar"),
      today = new Date;

  new Calendar(cal, today);
}

document.addEventListener("DOMContentLoaded", init);