我對編程/網路開發完全陌生。
我正在嘗試做的事情：我正在嘗試撰寫 JavaScript，它將從網頁或在線電子表格中獲取日期并更改文本或單元格背景的顏色。顏色更改將基于從 HTML 元素或在線電子表格中獲取的日期是否在今天的 14 或 30 天內。
這是我想要處理的 html 元素示例。我以各種格式放置日期以嘗試使用它們。
到目前為止我寫的 Javascript 我在這里發布，因為我可以讓元素改變顏色，但我不認為改變實際上是基于天數，我無法比較我想要的天數.
const now = new Date().toDateString();
const date1 = document.getElementById('test1').innerText;
for (let i = 0; i <= test.length; i ) {
i = test[i];
if (date1 <= now)
console.log('safe');
if (date1 >= now)
document.getElementsByClassName('test')[0].style.color = 'purple';
};<div class='test'>
<p id="test1">February 22 2022</p>
<br>
<p id="test">17/2/2022</p>
<br>
<p id="test">17 3 2022</p>
<br>
<p id="test">17 4 2022</p>
<br>
</div>uj5u.com熱心網友回復：
- ID 必須是唯一的。使用一個類，或者在我的情況下使用容器中的選擇器
- 你的測驗不是一個陣列，它是一個字串
- 您顯示的哪些日期是有效的？我假設在我的代碼中，任何一個
dd/mm/yyyy，，，dd mm yyyyMmm(...) dd yyyy
const months = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"]
const now = new Date();
document.querySelectorAll('.test p').forEach(p => {
const dString = p.textContent;
let [date, month, year] = dString.split(/[ \/]/)
const textMonth = months.indexOf(date.slice(0, 3))
if (textMonth != -1) { // we found a month name
date = month
month = textMonth
} else month -= 1;
const d = new Date(year, month, date)
console.log(d, d <= now)
p.classList.toggle("safe", !isNaN(d) && d <= now)
p.classList.toggle("unknown", isNaN(d))
p.classList.toggle("unsafe", !isNaN(d) && d > now)
}).safe {
color: green;
}
.unsafe {
color: purple;
}
.unknown {
color: red;
}<div class='test'>
<p>February 22 2022</p>
<br>
<p>17/1/2022</p>
<br>
<p>17/2/2022</p>
<br>
<p>17 3 2022</p>
<br>
<p>17 4 2022</p>
<br>
<p>17 4 2025</p>
<br>
</div>uj5u.com熱心網友回復：
而不是將它們轉換為字串，而是可以直接使用日期物件進行比較，并且 Date 建構式可以將字串作為輸入并從中生成一個物件。
嘗試這樣的事情：
const now = new Date();
const dates = document.getElementsByTagName('p');
for (d of dates) {
let dateString = d.innerText;
let dateObj = new Date(dateString);
if (dateObj < now)
console.log(`${dateObj} is older`);
else
console.log(`${dateObj} is today or newer`);
};<div class="test">
<p>February 22 2022</p>
<br>
<p>2/22/2022</p>
<br>
<p>2021 2 17</p>
<br>
</div>編輯：感謝您的想法abt片段！不太了解該功能。還發現 JS 不理解 DD/MM/YYYY，其中 MM 是 2 或 02 :(
還使用此處的其他建議和希望更易于理解的示例更新了代碼。
uj5u.com熱心網友回復：
如果您使用任何單頁應用程式，請安裝 moment.js 庫（npm I moment），或者如果您使用 HTML javascript，請添加 moment.js CDN
下面的代碼只是您的邏輯問題的一個示例
<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.29.1/moment.min.js" integrity="sha512-qTXRIMyZIFb8iQcfjXWCO8 M5Tbc38Qi5WzdPOYZHIlZpzBHG3L3by84BBBOiRGiEb7KKtAOAs5qYdUiZiQNNQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
</head>
<body>
<div id="Reset">
<button>Check date is under 30 days</button>
</div>
<script>
$(document).ready(function () {
$("#Reset").click(function () {
/* $.get("https://jsonplaceholder.typicode.com/todos", function (data) {
console.log(data);
alert("Load was performed.");
}) */
let curretDate = new Date();
let dateToCheck = new Date("01/12/2022");
let date_of_30_subtract = moment(curretDate).subtract(30, 'days');
console.log(moment(dateToCheck).isBetween(date_of_30_subtract,curretDate ))
});
});
</script>
</body>
</html>您可以設定在 14 天或 30 天之前必須檢查的日期。Thant 將減去這些天數并得到減法后的日期。
轉載請註明出處，本文鏈接：https://www.uj5u.com/houduan/420057.html
標籤：