From 4009e6bd5a2d8fc5fc94cdaee87f24e2962afb69 Mon Sep 17 00:00:00 2001
From: Thomas Fritsch <tf@kumquats.fr>
Date: Mon, 10 Feb 2020 00:20:04 +0100
Subject: [PATCH] =?UTF-8?q?fin=20B.3.=20+=20B.4.=20h=C3=A9ritage?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
js/main.js | 25 +++++++++++++++++++++----
1 file changed, 21 insertions(+), 4 deletions(-)
diff --git a/js/main.js b/js/main.js
index 02d6c4f..e2f6f48 100644
--- a/js/main.js
+++ b/js/main.js
@@ -27,22 +27,39 @@ const data = [
class Component {
tag;
+ attribute;
children;
- constructor(tag, children) {
+ constructor(tag, attribute, children) {
this.tag = tag;
+ this.attribute = attribute;
this.children = children;
}
render() {
- return `<${this.tag} ${
+ return `<${this.tag} ${this.renderAttributes()} ${
this.children ? `>${this.children}</${this.tag}>` : ' />'
}`;
}
+
+ renderAttributes() {
+ if (this.attribute) {
+ return `${this.attribute.name}="${this.attribute.value}"`;
+ }
+ return '';
+ }
+}
+
+class Img extends Component {
+ constructor(url) {
+ super('img', { name: 'src', value: url });
+ }
}
-const title = new Component('h1', 'La carte');
+const title = new Component('h1', null, 'La carte');
document.querySelector('.pageTitle').innerHTML = title.render();
-const img = new Component('img');
+const img = new Img(
+ 'https://images.unsplash.com/photo-1532246420286-127bcd803104?fit=crop&w=500&h=300'
+);
document.querySelector('.pizzasContainer').innerHTML = img.render();
--
GitLab