javascriptだと思ったのでこちらのカテを選びましたが違ったらすみません。
サイトに掲載しているデータを●日経過した時点で消したいのですが方法がわからず、アドバイス頂けないでしょうか。
行いたいことは、例えば<div id="hoge">~</div>といった感じで、指定したID内のコンテンツを、指定した日数経過するとページ上に掲載されないようにしたいです。
ただしこれらは、アクセスするユーザーごとに対応したいので一律●日経過で見えないようにするということではありません。
例えば、掲載期間が3日で指定した場合、Aさんは最初に訪れた日が5日前なので、すでに3日経過しているため見れない。Bさんは、今日初めてアクセスしたので、残り3日間閲覧が可能…、といった感じが希望です。
こういった事は可能でしょうか?もし、実現できるとしたらどのような方法か、具体的なアドバイスを頂けないでしょうか。
調べてみるのですが、経過日数は取得できるようなのですが、指定したものを消すという方法が見つかりません。
お詳しい方いらっしゃいましたら、よろしくお願いいたします。
No.4ベストアンサー
- 回答日時:
JavaScript だけで実現する具体的な方法。
お知らせ表示程度ならば、これで十分でしょう。
<style>
.notice .new { font-weight:bold; } /* 注目表示 */
.notice .expiration { display:none; } /* 期限切れ */
</style>
<script>
document.addEventListener('DOMContentLoaded', function(ev){var _=0;
_; function A(a){return Array.prototype.slice.apply(a)}
_; function QQ(s){return A(document.querySelectorAll(s))}
_; var DAY = 1000*60*60*24;
_; var attent = DAY * 1 / 24; // 最初の1時間は注目表示
_; var KEY = 'noticeFirstView';
_; var now = new Date().getTime();
_; var p = localStorage.getItem(KEY);
_; var record = p? JSON.parse(p): {};
_; var neo = {};
_; QQ('.notice *[id][data-days]').forEach(function(e){
_; _; var period = DAY * parseFloat(e.dataset.days);
_; _; var first = record[e.id];
_; _; if (first && now < first+attent) e.classList.add('new');
_; _; if (first && first+period < now) e.classList.add('expiration');
_; _; neo[e.id] = first? first: now; // お知らせを最初見た日時を記録
_; });
_; localStorage.setItem(KEY, JSON.stringify(neo)); // 閲覧記録をブラウザに保存
}, false);
</script>
<ul class=notice>
<li data-days=1 id=hogehoyohoe>1日だけ掲載したいお知らせ
<li data-days=2 id=foobarbazqu>2日だけ掲載したいお知らせ
<li data-days=4.5 id=issyhatrsgt>4日半だけ掲載したいお知らせ
</ul>
Ogre7077様
具体的な回答ありがとうございます、とても分かりやすく書いて頂き感謝申し上げます。
私の説明不足もあり、どの程度の厳格性か等の情報が無く大変失礼いたしました。まさにお知らせ程度、簡易的に実装できれば今回は問題ありません。
回答頂きました他の皆さまもお礼申し上げます。
ありがとうございました!
No.3
- 回答日時:
回答ではないけど気になったことを。
。。Javascriptとあるのでクライアント側だけで実現しようとしているのかな???
あと、見えないことの強さはどの程度なのかな???
(絶対に見せてはいけないのかというか。
例えば、他人の口座の残高とか。)
表示上見えなくても、ページ内Javascriptがユーザや日数に応じて表示制御だけをしている場合、ページソースを見れば古い内容はわかってしまいますね。
(表示制御する内容が増えると、見た目は大したことないのに、ページサイズは大きくなってロードが遅かったり、サーバ負荷が上がったりもあるかも。)
Ajax等で非同期でサーバから取得する作りならそこは回避できるかもしれません。
ただ、取得のクエリーがベタだとそこを変えるだけで古いものや他人のものを知ることができたりしちゃいます。
そうなるとセッション管理になってきて、クライアント側で表示を制御するのではなく、サーバ側で条件に応じて見せるものだけを返す方が自然かもしれません。

No.2
- 回答日時:
こんにちは
簡単に実現するのなら、以下のような方法の応用でできると思います。
http://www.pori2.net/js/cookie/1.html
http://www.red.oit-net.jp/tatsuya/java/cookie.htm
http://magnets.jp/web_design/4897/
経過日時の例がすぐには見つからなかったので、上記の例は「訪問回数」の表示になっています。
考え方はほぼ同じで、訪問回数を算出(記録)する代わりに、最初の訪問日を記録しておいて経過日数を算出して判定するという感じですね。
一律ではなく、ユーザーごとへの対応が可能な方法の一例といえます。
スクリプトで日時を参照する際に通常はクライアントの時刻設定を利用しますが、実は、クライアントの設定が正しくされているという保証はありません。
とはいうものの、経過日数を見たいだけなので、設定がずれていても経過時間(=差分)なので正しく測れるでしょう。
この方法の欠点としては、記録に利用している「クッキー」の機能はユーザー側でON/OFFが可能ですし、そもそもjavascriptの実行もユーザ側でOFFにできますので、そのような場合は機能しないということです。
>経過日数は取得できるようなのですが、指定したものを消すという方法が見つかりません。
要素の表示/非表示はstyle属性のdisplay:block/noneを切り替えたり、visibility:visible/hiddenを切り替えたりで実現できます。
具体的な方法は以下を参照してみてください。
http://allabout.co.jp/gm/gc/23973/
http://www.pori2.net/js/DOM/7.html
No.1
- 回答日時:
基本的にはログイン型のサイトにしてDBなどでユーザー情報を管理しないと
正確には処理できません。
ただjavascriptで簡易的にやる場合には
・初回アクセス日時
・前回アクセス日時
の2つくらいをcookieとして保存しておけば、それら日時と
現時点の日時を比較して、表示を変えることは可能です。
cookieの管理はjavascriptで1から書いてもいいですが
jQueryなどで処理するほうが楽かも
なお、javascriptやcookieはすべての環境で使えるわけではありません
きちんとやりたいのであればDBを検討ください
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- 求人情報・採用情報 内定先の求人が消えてない… 5 2023/07/19 01:00
- PHP PHPを使って、別サイトの一部を取得して表示したいのです。。 1 2023/01/18 21:45
- 派遣社員・契約社員 1週間前に契約期間の変更と言われ… 4 2022/03/26 18:32
- Excel(エクセル) EXCEL値貼り付け(ある条件のもと自動化) 5 2023/06/06 12:21
- リフォーム・リノベーション 業者のホームページに施工例が掲載される場合 2 2022/03/26 09:45
- HTML・CSS CSS上での計算を行うためのルールについて教えてください。 3 2022/08/15 14:43
- HTML・CSS 全部のアクセスを指定したページに転送させたい 2 2022/06/28 16:33
- 環境・エネルギー資源 再生可能エネルギーの供給過不足について 3 2022/04/09 22:45
- 婦人科の病気・生理 生理が予定日から今日で5日経っても全く来ません。 前回は予定日から3日後くらいに来ました。 生理予定 1 2022/06/02 14:30
- 確定申告 確定申告の「更生の請求」について 6 2022/10/24 19:07
関連するカテゴリからQ&Aを探す
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
javascriptでiframeのURL変更は?
-
C#で、ContextMenuStripに動的...
-
var_dumpのdump意味はを知りた...
-
C#OpenCv V4にのエラーに関する...
-
ASP.NETのコントロールの値をJa...
-
GASでundefinedエラーが出ます
-
Javascriptで指定した位置の文...
-
javascriptで同文字の出現回数...
-
google apps scriptの終了のさせ方
-
GASのエラー「undefined からプ...
-
毎日日付の変わるタイミングを...
-
jsによって検索プルダウン、都...
-
C# 演算 奇数と偶数 表現の仕方
-
AM,PMの時間表示について
-
シンプルなweb版スタンプラリー...
-
gas スプレッドシートがアクテ...
-
JavaScript window.openで開く...
-
同じIDで定義した要素の配列を...
-
ボタンをクリックすると数が増...
-
jspからjavascriptの変数引継ぎ
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
C#で、ContextMenuStripに動的...
-
ASP.NET MVCでObjectをjsに渡す
-
ローカルにあるファイルを検索...
-
C#OpenCv V4にのエラーに関する...
-
google apps scriptの終了のさせ方
-
イベントが初めの一回しか起き...
-
ジェネレーターの作り方
-
JavaScriptで文字列の特定文字...
-
javascriptでテーブルに追加し...
-
なぜmatchメソッドがエラーにな...
-
ASP.NETのコントロールの値をJa...
-
javascriptでiframeのURL変更は?
-
翌月を取得するGASが分かりません
-
1日1回だけ引けるjavascriptお...
-
商品コードを入力で、商品名、...
-
JavaScriptで平日のみをカウン...
-
jsによって検索プルダウン、都...
-
C# 演算 奇数と偶数 表現の仕方
-
GASでundefinedエラーが出ます
-
gas スプレッドシートがアクテ...
おすすめ情報
