我正在開發一個包含 html、css 和 js 的專案，我想創建許多 div（比如 200 個）所以，如何在不為 200 個不同的 div 實際撰寫代碼的情況下創建它們......我知道我可以做到用 js 但我只能用 html 和 css 來做嗎？
uj5u.com熱心網友回復：
正如我在評論中已經說過的，沒有 JavaScript 就無法做到。
JavaScript 解決方案如下：
const container = document.getElementById("container");
for (let i = 0; i < 200; i ) {
const item = document.createElement("div");
item.classList.add("item", "item-" i);
container.appendChild(item);
}#container {
border: 1px solid red;
padding: .5rem;
}
.item {
border: 1px solid black;
height: 3rem;
margin-bottom: .3rem;
}<div id="container">
</div>uj5u.com熱心網友回復：
使用 js 的一種方法：您可以創建一個 HTML Span 元素，然后使用 js 更改它的內容。我敢打賭，你會找到一些東西
uj5u.com熱心網友回復：
最近怎么樣？Html 或 css 不是編程語言。所以你不能做某種自動化或重復代碼或類似的事情。做這類事情的唯一方法是使用 Javascript。方法如下：
<div class="container">
<!-- let's say we trying to add divs here. -->
</div>
這是腳本：
function addMultiple (where, what, count, callBack) {
for (let i = 0; i < count; i ) {
// creating elements with document.createElement() method
let item = document.createElement(what)
// and then adding them into "where" element.
where.appendChild(item)
/*
and finally we'll have a function called Callback.
This is just gonna take our item as an argument and
do some stuff on it according to what we want.
(I'll show a simple usage down below)
*/
callBack(item)
}
}
// let's say we want to add 200 divs into "container" element
// and then we want to add class name to those divs.
const container = document.querySelector('.container')
addMultiple(container, 'div', 200, item => {
// this code will be repeated for all divs.
item.classList.add('what_ever_you_want')
})
轉載請註明出處，本文鏈接：https://www.uj5u.com/shujuku/428742.html
標籤：javascript html css 节点.js 网络