使用< iframe>创建Firebase博客文章. [英] Create Firebase Blog Post with <iframe>

问题描述

我的网站上有一个Firebase博客.现在，我要在其上发布iframe.我的想法是像将其他p标记一样将它们从JavaScript推入HTML，并在没有frame标记的情况下将Link写入数据库中……但这没用.有人知道为什么吗?这是不带框架标签的代码:

I have a Firebase Blog on my website. Now I want to post iframes on it. My idea is to push them like the other p tags from JavaScript into the HTML and write the Link into the database without the frame tag...but it didn´t work. Does anyone know why? Here is the Code without frame tag:

我有以下JavaScript代码:

I have following JavaScript Code:

let postCollection = document.querySelector("#posts-collection");

  const db = firebase.firestore();
  
  function createPost(title, time, content) {
    let div = document.createElement("div");
    div.setAttribute("class", "col-md-4");
  
    let h2 = document.createElement("h2");
    let p = document.createElement("p");
    let small = document.createElement("small");
  
    h2.textContent = title;
    small.textContent = time;
    p.textContent = content;
  
    div.appendChild(h2);
    div.appendChild(small);
    div.appendChild(p);
  
    postCollection.appendChild(div);
  }
  
  // Get Posts
  function getPosts() {
    db.collection("posts")
      .get()
      .then(snapshot => {
        snapshot.docs.forEach(docs => {
          createPost(
            docs.data().postName,
            docs.data().createdAt,
            docs.data().postContent
          );
        });
      })
      .catch(err => {
        console.log(err);
      });
  }
  
  getPosts();

以及以下HTML:

 <div class="blog" id="blog">
                    <h1>Blog</h1>
                  <!-- Example row of columns -->
                  <div class="row" id="posts-collection"></div>
                </div>

推荐答案

以下是我发布iframe的想法:

Here is my idea to post iframes:

let postCollection = document.querySelector("#posts-collection");
    
      const db = firebase.firestore();
      
      function createPost(title, time, content, link) {
        let div = document.createElement("div");
        div.setAttribute("class", "col-md-4");
      
        let h2 = document.createElement("h2");
        let p = document.createElement("p");
        let small = document.createElement("small");
        let frame = document.createElement("iframe"); 
      
        h2.textContent = title;
        small.textContent = time;
        p.textContent = content;
        iframe.textContent = link
      
        div.appendChild(h2);
        div.appendChild(small);
        div.appendChild(p);
        div.appendChild(iframe)
      
        postCollection.appendChild(div);
      }
      
      // Get Posts
      function getPosts() {
        db.collection("posts")
          .get()
          .then(snapshot => {
            snapshot.docs.forEach(docs => {
              createPost(
                docs.data().postName,
                docs.data().createdAt,
                docs.data().postContent
              );
            });
          })
          .catch(err => {
            console.log(err);
          });
      }
      
      getPosts();

这篇关于使用< iframe>创建Firebase博客文章.的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！