javascript - 根据 Javascript 使用 HTML 标签的问题

标签 javascript html arrays tags

这是我的代码,可以完美运行,但仅适用于单引号(稍后引用):

<section class="quote">
    <div class="content">
        <h4>Bruce Lee</h4>
            <p>Ever since I was a child I have had this instinctive urge for expansion and growth. To me, the function and duty of a quality human being is the sincere and honest development of one's potential.</p>
    </div>
</section> 

不过我想包括一个随机报价生成器。我已经有了脚本和以下内容:

<section class="quote">
    <div class="content">
        <p><script language="JavaScript">
            /* Copyright 2004 by CodeLifter.com */ 
            var Quotation=new Array()

            Quotation[0] = "Time is of the essence! Comb your hair.";
            Quotation[1] = "Sanity is a golden apple with no shoelaces.";
            Quotation[2] = "Repent! The end is coming, $9.95 at Amazon.";
            Quotation[3] = "Honesty blurts where deception sneezes.";
            Quotation[4] = "Pastry satisfies where art is unavailable.";
            Quotation[5] = "Delete not, lest you, too, be deleted.";
            Quotation[6] = "O! Youth! What a pain in the backside.";
            Quotation[7] = "Wishes are like goldfish with propellors.";
            Quotation[8] = "Love the river's \"beauty\", but live on a hill.";
            Quotation[9] = "Invention is the mother of too many useless toys.";

            var Q = Quotation.length;
            var whichQuotation=Math.round(Math.random()*(Q-1));
            function showQuotation(){document.write(Quotation[whichQuotation]);}
            showQuotation();
        </script></p>
    </div>
</section> 

问题:我想根据标签 <p> 将生成随机引文的脚本与其作者相关联报价和<h4>对于作者(在我的第一组代码中引用)。然后我很难弄清楚我将如何做到这一点。

我将如何编写生成随机引用并包含作者的脚本?我将如何用它们的特定标签来定义它们?

会不会是这样的:

Quotation[0] = "Why must we question pancakes?";
Author[0] = "Sigmund Freud";

但现在我如何让它们与它们的特定标签相关联: 报价同<p>使用 <h4> 标记和作者标签。

特别是报价部分。

更新:

 <section class="quote">
    <div class="content">
        <h4></h4>
        <p></p>

        <script language="JavaScript">
        /* Copyright 2004 by CodeLifter.com */ 
        var Quotation = [];

        Quotation[0] = ["example Author 1", "Time is of the essence! Comb your hair."];
        Quotation[1] = ["example Author 2", "Sanity is a golden apple with no shoelaces."];
        Quotation[2] = ["example Author 3", "Repent! The end is coming, $9.95 at Amazon."];
        Quotation[3] = ["example Author 4", "Honesty blurts where deception sneezes."];
        Quotation[4] = ["example Author 5", "Pastry satisfies where art is unavailable."];
        Quotation[5] = ["example Author 6", "Delete not, lest you, too, be deleted."];
        Quotation[6] = ["example Author 7", "O! Youth! What a pain in the backside."];
        Quotation[7] = ["example Author 8", "Wishes are like goldfish with propellors."];
        Quotation[8] = ["example Author 9", "Love the river's \"beauty\", but live on a hill."];
        Quotation[9] = ["example Author 10", "Invention is the mother of too many useless toys."];

        var Q = Quotation.length;
        var whichQuotation = Math.round(Math.random() * (Q - 1));

        document.querySelector('h4').textContent = Quotation[whichQuotation][0];
        document.querySelector('p').textContent = Quotation[whichQuotation][1];
        </script>
    </div>
</section> 

最佳答案

您要查找的是 .querySelector('p') 还是 .querySelector('h4')

document.querySelector('h4').textContent = // Author

试试这个:

<section class="quote">
  <div class="content">
    <h4></h4>
    <p></p>
  </div>
</section>
<script>
  var Quotation = [];

  Quotation[0] = ["example Author 1", "Time is of the essence! Comb your hair."];
  Quotation[1] = ["example Author 2", "Sanity is a golden apple with no shoelaces."];
  Quotation[2] = ["example Author 3", "Repent! The end is coming, $9.95 at Amazon."];
  Quotation[3] = ["example Author 4", "Honesty blurts where deception sneezes."];
  Quotation[4] = ["example Author 5", "Pastry satisfies where art is unavailable."];
  Quotation[5] = ["example Author 6", "Delete not, lest you, too, be deleted."];
  Quotation[6] = ["example Author 7", "O! Youth! What a pain in the backside."];
  Quotation[7] = ["example Author 8", "Wishes are like goldfish with propellors."];
  Quotation[8] = ["example Author 9", "Love the river's \"beauty\", but live on a hill."];
  Quotation[9] = ["example Author 10", "Invention is the mother of too many useless toys."];

  var Q = Quotation.length;
  var whichQuotation = Math.round(Math.random() * (Q - 1));

  document.querySelector('.content > h4').textContent = Quotation[whichQuotation][0];

  document.querySelector('.content > p').textContent = Quotation[whichQuotation][1];
</script>

关于javascript - 根据 Javascript 使用 HTML 标签的问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/36671873/

相关文章:

python - 将 np.savetxt 和 np.loadtxt 与多维数组一起使用

javascript - 如何在文本输入中设置图标?

javascript - 将 ExpressJS 与 nginx 一起使用时出现 502 Bad Gateway

javascript - 将 http 对象映射到模型

javascript - Uncaught TypeError : Cannot set property 'src' of null. ..选择你自己的冒险

javascript - 脚本标签正在从文件 :///instead of http://加载

html - Angular 动态行跨度

asp.net - 绘制html表头

ruby - 以编程方式创建此数组?

jquery - 在 jQuery 中添加带有 for 循环的 div