Javascript 如何创建html5的细节标签

我们需要使用html、css、javascript在angular 7中创建我自己的细节，比如html5标记。怎么做

版权1999-2018。
-根据参考数据。版权所有

本网站上的所有内容和图形均为公司参考数据的财产

使用

document.createElement

const details=document.createElement（'details'）；
常量p1=document.createElement（'p'）；
const p2=document.createElement（'p'）；
p1.textContent='-按引用数据。保留所有权利。”；
p2.textContent='本网站上的所有内容和图形均为公司参考数据的财产'；
详细信息。儿童（p1）；
详细信息。追加子女（p2）；
文件.正文.附件（细节）使用angular cli创建组件时，您将调用的名称将是标记的名称，但它将显示为“应用程序详细信息”。要更改此设置，您可以在语音“选择器”的组件装饰器中随意更改它
您可以使用单击事件上的切换方法来显示和隐藏详细信息内容。
此链接是一个示例，如您的html详细信息：



{{event.name}
-根据参考数据。版权所有

本网站上的所有内容和图形均为公司参考数据的财产

希望您至少尝试自己编写代码。我建议你做一些，或者通过谷歌，或者通过搜索，尝试一下。如果您仍然有问题，请带着您的代码回来解释您尝试过的内容。我不喜欢这样，我们在这里讨论的是角度，而您正在抛出所有这些低级元素创建和附加，我认为这既不必要也不可行。我不喜欢这样，我们在这里讨论的是角度，你把所有这些低级元素创建和附加，我认为这既不是必要的，也不是可行的。
<div *ngFor="let event of events;" class="event-list">

    <section class="event-item" (click)="event.toggle=!event.toggle">
        <div class="event-summary">
            <summary class="event-name">{{ event.name }} </summary>
        </div>
    </section>

    <!-- WANT TO SHOW THIS WHEN ABOVE SECTION ELEMENT IS CLICKED -->
    <section class="event-details" *ngIf="event.toggle">
    <p> - by Refsnes Data. All Rights Reserved.</p>
  <p>All content and graphics on this web site are the property of the company Refsnes Data.</p>
    </section>
    <!-- END SECTION -->

</div>