javascript 将卡片中的文本插入模式窗口

0pizxfdo  于 2023-03-21  发布在  Java
关注(0)|答案(1)|浏览(111)

我是js的初学者
有一个问题,我有一个6张幻灯片的滑块,其中反馈卡,当我点击“阅读全文”按钮时,我需要将此评论输入到模态窗口中,更准确地说,我需要从事件发生的块中获取数据并将其插入模态

let reviewsbtn = document.querySelectorAll(".reviews_link")
let reviewswindow = document.querySelector("#reviews_window")
let reviewsbox = document.querySelector("#reviews_wrap")
let closeButtonReviews = document.getElementById("closeButtonreviews");
let results

for (results of reviewsbtn) {
  results.addEventListener("click", openReviwes)

}

function openReviwes(event) {
  reviewswindow.classList.add("reviews_window")
  reviewsbox.classList.add("reviews_wrap")
}

closeButtonReviews.addEventListener("click", closebox)

function closebox() {
  reviewswindow.classList.remove("reviews_window")
  reviewsbox.classList.remove("reviews_wrap")
}
<div class="swiper-slide">
  <div class="reviews_box">
    <div class="reviews_name">
      <img src="img/A.svg" alt="Reviews">
      <p class="reviews__name">Гоар</p>
    </div>
    <p class="reviews_text">.....</p>
    <button type="button" id="reviews_buttons5" class="reviews_link">read in full</button>
  </div>
</div>

<div id="reviews_window">
  <div id="reviews_wrap">
    <div class="reviews_name">
      <img src="img/d-reviews.svg" alt="Reviews">
      <p>Jonh</p>
    </div>
    <p>...</p>
    <button type="button" id="closeButtonreviews" class="reviews_close"></button>
  </div>
</div>

我不知道怎样才能做得更好

jmo0nnb3

jmo0nnb31#

您可以在按钮的父级上使用document.querySelector选择正确的元素。

function openReviwes(event) {
    // ...
    reviewsbox.querySelector('#reviews_wrap > p').textContent = 
       event.target.parentElement.querySelector('.reviews_text').textContent;
}

相关问题