diff --git a/array_challenges.js b/array_challenges.js index 3e3c564..3e3f7d6 100644 --- a/array_challenges.js +++ b/array_challenges.js @@ -45,6 +45,21 @@ const movies = [ */ // ✍️ Solve it here ✍️ + + const MovieMania =[ + {title: "fast & furious 10" , genre: "action",rating: 7.5, rented: true}, + {title: "the note book", genre: "drama", rating: 8.0, rented: false}, + {title: "spider-man no way home", genre: "action" , rating: 8.7, rented: true}, + {title: "superbad" , genre: "comady", rating: 7.0, rented: false}, + {title: "the dark knight", genre: "action", rating: 9.0, rented: true}, + {title: "the interm" ,genre: "comady", rating: 7.4, rented: false}, + ]; + + const RatingMovies =MovieMania.map(function(item){ + return `title: ${item.title},rating: ${item.rating}` + }); + + console.log(RatingMovies); /* @@ -67,5 +82,13 @@ const movies = [ // ✍️ Solve it here ✍️ + const highlyRating =MovieMania.filter(function(items){ + return items.rating >= 8.0 + }); + + console.log(highlyRating); + + + \ No newline at end of file diff --git a/dom_challenges.js b/dom_challenges.js index 1f414b8..d9712f6 100644 --- a/dom_challenges.js +++ b/dom_challenges.js @@ -158,25 +158,62 @@ export function displayArticles(category, featuredArticle = null) { const article = featuredArticle || articles[0]; // 1. Clear previous content + newsContainer.innerHTML =""; + // 2. Create container elements - + const newsDataContainer = document.createElement ("div") + newsDataContainer.className = "featured-article" + + // 3. Create article element + const newsCard = document.createElement("article") + newsCard.className = "news-card featured" + + + // 4. Create and setup image + const newImage = document.createElement("img") + newImage.src= article.image + newImage.alt= article.tag + newImage.className = "news-image" - // 5. Create content container + + // 5. Create content container + const contentContainer = document.createElement("div") + contentContainer.className= "news-content" // 6. Create featured label + const featuredlabel = document.createElement("span") + featuredlabel.className = "featured-label" + featuredlabel.textContent = "Featured Story" + // 7. Create title +const newTitle = document.createElement("h2") +newTitle.textContent = article.title +newTitle.className = "news-title" // 8. Create date + const newsDate = document.createElement("div") + newsDate.className = "news-date" + newsDate.textContent= article.date + // 9. Create excerpt + const newExpert = document.createElement("p") + newExpert.className = "news-excerpt" + newExpert.textContent = article.excerpt + // 10. Create tag + const newTag = document.createElement("span") + newTag.className = "tag" + newTag.textContent = article.tag + + // 11. Assemble the elements @@ -184,8 +221,28 @@ export function displayArticles(category, featuredArticle = null) { // 12. Append the article container to the news container +newsDataContainer.append(newsCard ) + +newsCard.append(newImage) +newsCard.append(contentContainer) +contentContainer.append(featuredlabel) +contentContainer.append(newTitle) +contentContainer.append(newsDate) +contentContainer.append(newExpert) +contentContainer.append(newTag) + +newsContainer.append(newsDataContainer) +return newsContainer + + + + } +console.log(displayArticles("Latest News")) + + + // DO NOT CHANGE THIS document.addEventListener("DOMContentLoaded", () => { const defaultCategory = "Latest News"; // Define the default category diff --git a/index.html b/index.html index 6a59a72..1fe100f 100644 --- a/index.html +++ b/index.html @@ -106,6 +106,8 @@

Apple Unveils Revolutionary Mixed Reality Device

+ + \ No newline at end of file diff --git a/s b/s new file mode 100644 index 0000000..e69de29