普通に記事を書いて西暦を半角あるいは...すると西暦などをtimeタグで囲む

これらは普通にタグで囲む必要はなくその文章の親要素に.almanacを入れます。
例えばこの段落は通常の文章が書かれているだけなので西暦を書いても何も起こりません。単なる文字です。
2023年06年23日とか、2023/06/23、あるいは2023/6/23更には2023年6/23など

しかし段落pにclassで<p class='almanac'>とすると、その段落内の西暦はtimeタグで囲まれます。
この記事ではtimeタグで囲んであるのがわかるようにstyleで赤色になるようにしてあります。

西暦などがタグで囲めるならば、そのタグをループして色々できるんじゃなかろうかと言う機能です。

almanac(年鑑)で何ができるか

almanacクラスは西暦をtimeタグで囲むだけのものです。

先程と同じ2023年06年23日とか、2023/06/23、あるいは2023/6/23更には2023年6/23などを記事中に書くと赤色になったのがわかると思います。
無理やり間違ってますが、2023年06年と月と入るべき所を年にしてもそれらはtimeタグでは囲まれません。

形式的にはもちろん改造等もできますが、yyyy年MM月dd日のようなもの、02とかは2でも問題ありません。年は必ず4桁で。
区切りとしては年月日かあるいはスラッシュ(/)が利用できます。また大文字の数字には対応してません。またガチガチのコードのように、数値のチェックとかその日が存在するか等のチェックはしてませんのであくまでおまけ程度のものとして了承いただけますようお願いします。

almanacに続くクラスで処理を変える

almanacはテキストの中の西暦みたいなものをtimeタグで囲むというだけのものですが、このあとに続くクラスとして現在は3つ、.age、.leftDays、.agoを用意しました。
これらは単体では機能せず、almanacによって、timeタグで囲んだ記事中のテキストの処理の仕方の判別として利用しています。

age

ageは現在の年齢を算出します。ブログなどでは〇〇歳と書くと手動で更新していかない限りずっとその年齢が続きます。去年に22歳になっても今年の誕生日が来れば23歳なわけです。
そこで誕生日がわかればそれを必要箇所に入れてクラスにageを加えると現在の日時から誕生日までの差を計算してtitle属性に年齢を入れます。
PCであればマウスオーバー(ホバー)することで年齢が表示されるようになります。スマホであればタップで出るでしょうか。

柏木由紀は1991年7月15日生まれ
小栗有以は2001年12月26日生まれ
織田信長は1534年6月23日

ただそれだけだと使いにくいですが、次のように3つ目のクラスでviewを加えると直接年齢が表示されます。

柏木由紀は1991年7月15日生まれ
小栗有以は2001年12月26日生まれ
織田信長は1534年6月23日

このように同じ文章でクラスを変えて表示を変えると文章がおかしくなるので、

柏木由紀(1991年7月15日)は...
小栗有以[2001年12月26日]は...
織田信長(1534年6月23日)は尾張国で生まれる。

このような感じにテキストを工夫する必要があります。
viewを入れた場合にはtitle属性に生年月日が入るので年齢だけではなく生年月日もわかります。これらは現在の日時との差で計算されているのと、既に亡くなっている織田信長も存命であれば、あるいは年齢で表示はされるけれどもどれぐらい前の人かぐらいまではわかるかと思います。
これらは以下のような形で書かれています。

<p class='almanac age view'>
	柏木由紀(1991年7月15日)は...<br/>
	小栗有以[2001年12月26日]は...<br/>
	織田信長(1534年6月23日)は尾張国で生まれる。
</p>

[info red]このページでだけ適応するようにstyleが記事の先頭に入れてあるのでtimeタグは赤くなってますが別途スタイルしないと色は付きません。
ただ（）については別のコードでカッコを装飾できるようにしてあるので、それが作用して若干文字が小さくなっているかと思います。[/info]

leftDays

これは例えばクリスマスまであと何日かというような場合に使用することを目的としていて、期日がすぎれば「終了」と表示されるようになります。
これにもviewクラスがあります。例としては以下のような感じです。

2023年のクリスマスは2023年12月25日
viewが付くと以下のようになります。

2023年のクリスマスは2023年12月25日
2022年のクリスマスは2022年12月25日 

<p class='almanac leftDays view'>2022年のクリスマスは2022年12月25日</p>

このようにageもleftDaysも同じように書けます。

[info blue]オンラインの計算サイトで実際に誰かの誕生日を見てみると1日少ないように思いました。
当日を含むか含まないか、おそらく起点にズレがあるかアメリカの時間だからなのだろうと思います。過ぎてしまってからでは役に立ちませんが前日つまり、クリスマスでは12/24の23:59:59が「～まで」の計算になっているのだろうと想像しています。プラグイン等で当日を含むものもあったので色々実験してみて適用するかを別途考えます。[/info]

ago

何かしらの西暦が何年前かという計算は意外と面倒くさいと自分は思うので入れてみました。
極端にBCでも行けるようにしてあります。ただし正確な計算ではありません。

ずっと昔が何年前か？BC5000年は5000+2023
BC2370年とかも。

[こちらはviewあり]
ずっと昔が何年前か？BC5000年は5000+2023
BC2370年とかも。

viewのある無しで上記のような感じになります。BC5000年はBCと5000年で分けられて処理されています。5000年だけであれば過去か未来かわからないため。
例えばフランス革命が1789年だからということでこのまま書くと親要素にalmanacが入っていても西暦を拾えません。そういう場合は1789年5月5日とフルで書くか、1789/5/5とスラッシュで区切るか、AD1789年(年は多分不要)と書くなどする必要があります。

上の段落にはclass='almanac ago'だけが入っています。

クラスにalmanac ago viewと入れた例
桶狭間の戦いは、永禄3年5月19日1560年6月12日に尾張国知多郡桶狭間での織田信長軍と今川義元軍の合戦。

上記のようにすると永禄3年5月19日の年月日も拾ってしまいます。timeタグで不要な所も拾ってしまいますが、以下のようにすると回避することができます。

桶狭間の戦いは、永禄3年5月19日(1560年6月12日)に尾張国知多郡桶狭間での織田信長軍と今川義元軍の合戦。

上記は、

<p class='noCheck'>桶狭間の戦いは、永禄3年5月19日(<span class='almanac ago view'>1560年6月12日</span>)に尾張国知多郡桶狭間での織田信長軍と今川義元軍の合戦。<p>

という感じで書かれています。p要素のクラスのnoCheckはカッコを装飾しないように無視するクラスです。それとは別でこのalmanac等は書かれているのでカッコで囲っても処理はできます。ただまぁここまで書くならtimeタグで書いても…とは思いますが、そこはひとまず現状で。

注意事項とか

これらほとんどは独自にコードを書いていますが、日付の一部処理はDayJSを利用しています。日付のバリデーション等は行っていないので、正しい日付を書かないと日にちがズレることがあります。

バリデーションはDayJSのプラグインにありますが、例えば2023年13月25日などとすると、2024年1月25になってしまったりとするため、バリデーションしてもどっちみちズレるという事から特別導入はしていませんので、正しい日にちを書くようにしてください。
これらはオブジェクトのインデックスとして処理されているためです。表示が1月であれば、インデックスは0になり、2月は1、3月は2…12月は11となっています。