Classe versie 1.0
This commit is contained in:
@@ -29,7 +29,7 @@
|
|||||||
<td>
|
<td>
|
||||||
<article>
|
<article>
|
||||||
<img src="images/Icon awesome-apple-alt.png" alt="">
|
<img src="images/Icon awesome-apple-alt.png" alt="">
|
||||||
<h2>Tomaat</h2>
|
<h2 class="plant-naam">Tomaat</h2>
|
||||||
</article>
|
</article>
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
|
|||||||
@@ -1,32 +1,49 @@
|
|||||||
dataHardObject = {
|
dataHardObject = [
|
||||||
"id": 1,
|
{
|
||||||
"plantnaam": "Tomaat",
|
"id": 1,
|
||||||
"plantensoort": "Groente",
|
"plantNaam": "Tomt",
|
||||||
"plantGeteelt": 1
|
"plantensoort": "Groente",
|
||||||
}
|
"plantGeteelt": 1
|
||||||
|
},
|
||||||
// Nieuwe planten aanmaken in de table
|
{
|
||||||
// function hardcodeData(dataHardObject)
|
"id": 2,
|
||||||
// {
|
"plantNaam": "Komkommer",
|
||||||
// dataHardObject => "id"
|
"plantensoort": "Groente",
|
||||||
// }
|
"plantGeteelt": 1
|
||||||
|
}
|
||||||
|
]
|
||||||
|
|
||||||
class Plant {
|
class Plant {
|
||||||
constructor(dataHardObject) {
|
constructor(dataObject) {
|
||||||
this.id = dataHardObject.id;
|
this.id = dataObject.id;
|
||||||
this.plantNaam = dataHardObject.plantNaam;
|
this.plantNaam = dataObject.plantNaam;
|
||||||
this.plantensoort = dataHardObject.plantensoort;
|
this.plantensoort = dataObject.plantensoort;
|
||||||
this.plantGeteelt = dataHardObject.plantGeteelt;
|
this.plantGeteelt = dataObject.plantGeteelt;
|
||||||
}
|
}
|
||||||
|
|
||||||
htmlData(plantNaam) {
|
htmlData() {
|
||||||
if (this.plantGeteelt)
|
if (this.plantGeteelt)
|
||||||
{
|
{
|
||||||
const titel = document.querySelector(".plant-naam");
|
const titel = document.querySelectorAll(".plant-naam");
|
||||||
titel.textContent = this.plantNaam;
|
// titel.forEach(element => {
|
||||||
|
// element.textContent = this.plantNaam;
|
||||||
|
for (let i = 0; i < titel.length; i++) {
|
||||||
|
const element = titel[i];
|
||||||
|
element.textContent = this.plantNaam;
|
||||||
|
}
|
||||||
|
// });
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
const tomaatPlant = new Plant(dataHardObject);
|
// document.addEventListener('DOMContentLoaded', (event) => {
|
||||||
tomaatPlant.htmlData();
|
// const tomaatPlant = new Plant(dataHardObject[0]);
|
||||||
|
// tomaatPlant.htmlData();
|
||||||
|
// });
|
||||||
|
|
||||||
|
document.addEventListener("DOMContentLoaded", (event) => {
|
||||||
|
dataHardObject.forEach(plantObject => {
|
||||||
|
const plant = new Plant(plantObject);
|
||||||
|
plant.htmlData();
|
||||||
|
});
|
||||||
|
})
|
||||||
Reference in New Issue
Block a user