【基因检测人工智能】如何使用JAVASCRIPT在HTML文档内部增加一个段落-优快云博客

本文链接：https://blog.youkuaiyun.com/genedecoders/article/details/132241906

【基因检测人工智能】如何使用JAVASCRIPT在HTML文档内部增加一个段落

目的：采用JAVASCRIPT在一个HTML网页中增加一个段落。

下面是原来的HTML代码部分：

<!DOCTYPE html>
<html lang="zh-Hans">
    <head>
        <meta charset="UTF-8">
        <title>测基因，阻断遗传就在“佳学基因”干</title>
        <meta name="viewpoint" content="width=device-width; scale=1">
        <script src="js/paddtion_in_body.js"></script>

    </head>
    <body id="myBody">
        <h1 id="myh1">测基因，阻断遗传就在“佳学基因”干</h1>
        <p id="existingp">在第一段里，介绍了佳学基因如何采用基因解码技术更快更准地对已诊断的罕见病、疑似疾病病例及未确诊病例，找到疾病基因。</p>
        </body>
    </html>

下面是JAVASCRIPT代码部分

document.addEventListener('DOMContentLoaded', function padditioninbody() {
    const bodytoadd = document.getElementById("myBody");
    const paratoadd = document.createElement("p");
    paratoadd.textContent = "在第二段里拟介绍肌营养不良、脱发、肿瘤等不同遗传病的发病原因查找的基因检测项目价格、费用、及如何进行检测的流程。";
    bodytoadd.appendChild(paratoadd);
});

代码解释

1、HTML采用了简单的结构，包含文档类型定义，HEAD内容。页面的题目可以是根据需求来自定义，如“华大基因检测，佳学基因检测，罕见病基因，人工智能学习”等。
2、使用了事件监听语句： addEventListener, 和监听事件： DOMContentLoaded. 使得修改过程在HTML文档的全部内容加载后进行，否则，JAVASCRIPT不能发现需要修改的对象。
3、采用getElementbyId指定需要修改的上一层结构，这里是部分。并将需修改的部分命名为"bodytoadd".
4、新增加一个网页成分

, 并将其命名为paratoadd.
5、为新加的段落内容制定内容： “在第二段里拟介绍肌营养不良、脱发、肿瘤等不同遗传病的发病原因查找的基因检测项目价格、费用、及如何进行检测的流程。”
6、使用bodytoadd指明添加的位置，使用appendChild行驶添加动作，采用paratoadd，指加添加的内容。