Hướng dẫn how do i open another html in html? - làm cách nào để mở một html khác trong html?

W3.js khá tuyệt.

https://www.w3schools.com/lib/w3.js

Và chúng tôi tập trung

w3-include-html

Nhưng hãy xem xét trường hợp dưới đây

- 🧾 popup.html - 🧾 popup.js - 🧾 include.js - 📂 partials - 📂 head - 🧾 bootstrap-css.html - 🧾 fontawesome-css.html - 🧾 all-css.html - 🧾 hello-world.html 

Hello World

Script

// include.js const INCLUDE_TAG_NAME = `data-include-html` /** * @param {Element} node * @param {Function} cb callback * */ export async function includeHTML(node, { cb = undefined }) { const nodeArray = node === undefined ? document.querySelectorAll(`[${INCLUDE_TAG_NAME}]`) : node.querySelectorAll(`[${INCLUDE_TAG_NAME}]`) if (nodeArray === null) { return } for (const node of nodeArray) { const filePath = node.getAttribute(`${INCLUDE_TAG_NAME}`) if (filePath === undefined) { return } await new Promise(resolve => { fetch(filePath ).then(async response => { const text = await response.text() if (!response.ok) { throw Error(`${response.statusText} (${response.status}) | ${text} `) } node.innerHTML = text const rootPath = filePath.split("/").slice(0, -1) node.querySelectorAll(`[${INCLUDE_TAG_NAME}]`).forEach(elem=>{ const relativePath = elem.getAttribute(`${INCLUDE_TAG_NAME}`) // not support ".." if(relativePath.startsWith('/')) { // begin with site root. return } elem.setAttribute(`${INCLUDE_TAG_NAME}`, [...rootPath, relativePath].join("/")) }) node.removeAttribute(`${INCLUDE_TAG_NAME}`) await includeHTML(node, {cb}) node.replaceWith(...node.childNodes) // https://stackoverflow.com/a/45657273/9935654 resolve() } ).catch(err => { node.innerHTML = `${err.message}` resolve() }) }) } if (cb) { cb() } } 

// popup.js import * as include from "include.js" window.onload = async () => { await include.includeHTML(undefined, {}) // ... } 

đầu ra

Hello World

---

Tìm hiểu làm thế nào để bao gồm các đoạn trích HTML trong HTML.

---

HTML

Lưu HTML bạn muốn đưa vào tệp .html:

content.html

Google Maps Nút hoạt hình Box Modal Hộp hoạt hình Tiến trình Thanh treo lơ lửng nhấp vào Dropdowns Bảng đáp ứng bảng
Animated Buttons

Modal Boxes

Animations

Progress Bars

Hover Dropdowns

Click Dropdowns

Responsive Tables

---

Bao gồm HTML

Bao gồm HTML được thực hiện bằng cách sử dụng thuộc tính W3-Include-HTML:w3-include-html attribute:

Thí dụ

---

Hãy tự mình thử »

Làm cách nào để truy cập vào tệp HTML khác trong HTML?

Thí dụ

Cuộc gọi bao gồmhtml () ở cuối trang:

---

---

Bao gồm nhiều đoạn trích HTML

Bạn có thể bao gồm bất kỳ số lượng đoạn trích HTML nào:

Thí dụ

Hãy tự mình thử »

Làm cách nào để truy cập vào tệp HTML khác trong HTML?

Làm cách nào để hiển thị một trang HTML sang trang HTML khác?

Làm cách nào để mở một trang HTML từ một trang khác?

Chúng tôi

• Giới thiệu
• Liên hệ
• Tuyển dụng
• Quảng cáo

Điều khoản

• Điều khoản hoạt động
• Điều kiện tham gia
• Quy định cookie

Trợ giúp

• Hướng dẫn
• Loại bỏ câu hỏi
• Liên hệ

Mạng xã hội

• Facebook
• Twitter
• LinkedIn
• Instagram

---

Bản quyền © 2021 Học Tốt Inc.