Chào các bác,
Em đang gặp vấn đề trong việc lấy dữ liệu từ file data.html. cụ thể:
Đây là bảng HTML trong file data.html

Đây là index.html

Vấn đề mà em gặp phải là thông tin về môn học "Học phần: Thiết kế đồ họa và quảng cáo" trong file data.html được hiển thị vào thứ 5, nhưng trong index.html lại hiển thị vào thứ 3. Em đã cố gắng nhiều lần mà vẫn không tìm ra nguyên nhân. Mong các bác giúp em với!
Cảm ơn mọi người!
Em đang gặp vấn đề trong việc lấy dữ liệu từ file data.html. cụ thể:
Đây là bảng HTML trong file data.html

Đây là index.html

Vấn đề mà em gặp phải là thông tin về môn học "Học phần: Thiết kế đồ họa và quảng cáo" trong file data.html được hiển thị vào thứ 5, nhưng trong index.html lại hiển thị vào thứ 3. Em đã cố gắng nhiều lần mà vẫn không tìm ra nguyên nhân. Mong các bác giúp em với!
Cảm ơn mọi người!
Trùm Phụ đã thích bài viết này
Mình đọc qua thì thấy ý của bạn hơi khó hiểu, nhưng mình có một số thông tin có thể giúp ích cho bạn nè. Mình nghĩ điều này cũng trùng ý với bạn @. . . .:
Test 1: Dùng để chọn file data.html, nó sẽ tự động trích xuất nội dung trong table ra thành một file JSON cho bạn tải về.
Test 2: Dùng để chọn file data.json, nó sẽ tự hiển thị nội dung giống hệt với file index mà bạn đã cung cấp.
Test 3: Sử dụng để chỉnh sửa nội dung của file data.json của bạn.
Test 4: File này có hơi khác một chút. Kéo xuống cuối file ở view-source, bạn sẽ thấy dòng này: new Schedule('data.json'); thì data.json chính là file được dùng để load nội dung ra. Khi truy cập, nó cũng xuất ra nội dung y hệt Test 2, nhưng nội dung sẽ là file từ hệ thống và bạn phải tạo một file data.json và copy nội dung trong file trên máy để lưu lại.
Đây là link đến file data.json của mình: data.json
ở đây có sai sót đáng lẽ môn trong ảnh là vào thứ 5 nhưng sau khi chuyển lại thành thứ 3
@copecute về cơ bản thì đang gặp lỗi khi duyệt object, nó đang hiểu là học phần thiết kế đồ họa thuộc về thứ 3, vì phụ thuộc vào số lượng phần tử cột/hàng
fetch('data.html') .then(response => response.text()) .then(htmlString => { const parser = new DOMParser(); const doc = parser.parseFromString(htmlString, 'text/html'); const table = doc.querySelector('.table-bordered tbody'); const rows = table.querySelectorAll('tr'); const result = []; // Mảng chứa tên các ngày trong tuần const days = ['Thứ hai', 'Thứ ba', 'Thứ tư', 'Thứ năm', 'Thứ sáu', 'Thứ bảy', 'Chủ nhật']; rows.forEach((row, index) => { const cells = row.querySelectorAll('td'); const rowData = {}; // Lấy nội dung của phần tử đầu const tietDau = cells[0].innerText.trim(); // Mặc định tất cả các ngày sẽ là null days.forEach(day => { rowData[day] = null; }); // Gán giá trị cho từng ngày từ cells for (let i = 1; i < cells.length; i++) { const value = cells[i].innerText.trim(); // Lấy nội dung ô if (value) { // Nếu ô có giá trị // Gán giá trị cho ngày tương ứng rowData[days[i - 1]] = value; } } // Chỉ xét đối tượng thứ 8 (index 7) if (index === 7) { // Nếu có dữ liệu ở "Thứ 3", gán cho "Thứ 5" và xóa "Thứ 3" if (rowData['Thứ ba']) { rowData['Thứ năm'] = rowData['Thứ ba']; // Gán dữ liệu từ thứ 3 cho thứ 5 rowData['Thứ ba'] = null; // Đặt thứ 3 thành null } } // Tạo object với "Tiết X" là key và rowData là value const rowObject = { ["Tiết " + tietDau]: rowData }; result.push(rowObject); }); console.log(result); }) .catch(error => { console.error('Error fetching data:', error); });<td rowspan="5">nội dung</td>ví dụ biến nó thành 5 cái
<td id="rowspan-5">nội dung</td>sau đó kiểm duyệt lại object