当前位置: 首页 > news >正文

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

【基因检测人工智能】如何使用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,指加添加的内容。

运行测试

可以使用visual code拷贝上述代码进行测试,并按照自己的需要进行修改使用。

相关文章:

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

【基因检测人工智能】如何使用JAVASCRIPT在HTML文档内部增加一个段落 目的&#xff1a;采用JAVASCRIPT在一个HTML网页中增加一个段落。 下面是原来的HTML代码部分&#xff1a; <!DOCTYPE html> <html lang"zh-Hans"><head><meta charset&quo…...

unittest单元测试

当你在编写测试用例时&#xff0c;可以使用Python内置的unittest模块来进行单元测试。下面是一个逐步指南&#xff0c;帮助你理解如何编写和运行基本的单元测试。 导入必要的模块&#xff1a; 首先&#xff0c;你需要导入unittest模块和需要测试的模块&#xff08;例如&#xf…...

每天一道leetcode:72. 编辑距离(动态规划困难)

今日份题目&#xff1a; 给你两个单词 word1 和 word2&#xff0c; 请返回将 word1 转换成 word2 所使用的最少操作数 。 你可以对一个单词进行如下三种操作&#xff1a; 插入一个字符 删除一个字符 替换一个字符 示例1 输入&#xff1a;word1 "horse", word…...

详细介绍如何使用 OpenCV 对图像进行锐化

将了解锐化图像的过程,我们将使用内核来突出显示每个特定像素并增强其发出的颜色。它与模糊过程非常相似,只不过现在我们不是创建一个内核来平均每个像素强度,而是创建一个内核,该内核将使像素强度更高,因此对人眼来说更加突出。 了解流程的后端。 很高兴知道内核用于模糊…...

Java代理模式——静态代理与动态代理

代理模式 代理模式允许你为其他对象提供一个代理&#xff0c;以控制对这个对象的访问。代理模式在不改变实际对象的情况下&#xff0c;可以在访问对象时添加额外的功能。 可以理解为代理模式为被代理对象创造了一个替身&#xff0c;调用者可以通过这个替身去实现这个被代理对…...

Vue day02 Computed和Watch

1.事件绑定 可以用 v-on 指令监听DOM 事件&#xff0c;并在触发时运行一些 JavaScript 代码。v-on 还可以接收一个需要调用的方法名称。 <button v-on:click"handler">good</button> methods: { handler: function (event) { if (event) { alert(event.t…...

【Java】一只小菜坤的编程题之旅【3】

文章目录 1丶判定是否互为字符重排2、杨辉三角3丶某公司的1个面试题&#xff08;字符串包含问题&#xff09; 1丶判定是否互为字符重排 这个题我们用一个非常简单的思想就能实现&#xff0c;我们先将字符串转换为字符数组&#xff0c;然后对字符数组进行排序&#xff0c;然后再…...

全面掌握 Jaeger 分布式调用链路跟踪理论和实战,Go 为所有使用 go-resty 库发起 HTTP 请求集成链路跟踪 jaeger(附源码)

全面掌握 Jaeger 分布式调用链路跟踪理论和实战,Go 为所有使用 go-resty 库发起 HTTP 请求集成链路跟踪 jaeger(附源码)。 介绍一个开源的分布式跟踪系统 Jaeger,首先从理论基础知识开始学习,将学习如何在 HTTP 请求中集成链路跟踪,以及如何在 GORM 框架实现,最后学习 …...

vue键盘和鼠标事件

1、键盘事件 **按Enter键** keyup.enter**按PageDown键** keyup.page-down **按Tab键** keyup.tab **按Delete键** keyup.delete **按ESC键** keyup.esc**按Space键** keyup.space **按↑&#xff08;Up&#xff09;键** keyup.up**按↓&#xff08;Down&#xff09;键** keyup…...

Chrome 手动代理设置 HTTP/Socks5

1、安装代理插件&#xff1a;SwitchyOmega 在线安装 从 Chrome 应用商店 安装&#xff0c;如果您无法从该链接安装&#xff0c;请使用下面的离线安装。 离线安装 ①、去 Github 下载 最新版安装包 &#xff0c;或者直接 本地下载 文件进行安装。 ②、下载安装文件后&#xf…...

SpringBoot第35讲:SpringBoot集成连接池 - 默认连接池HikariCP

SpringBoot第35讲&#xff1a;SpringBoot集成连接池 - 默认连接池HikariCP 本文是SpringBoot第35讲&#xff0c;主要介绍数据库连接池&#xff0c;以及SpringBoot集成默认的HikariCP的实践。 文章目录 SpringBoot第35讲&#xff1a;SpringBoot集成连接池 - 默认连接池HikariCP1…...

选择最适合自己的笔记本

选择最适合自己的笔记本电脑 一、了解笔记本品牌一线品牌准一线品牌二线品牌三线品牌 二、笔记本入手渠道笔记本入手渠道 三、根据需求选择机型使用需求1.日常使用2.商务办公、财务3.轻度剪辑、ps4.代码5.创意设计6.游戏 四、笔记本电脑配置如何选1.cpu2.显卡&#xff08;GPU&a…...

前端安全:探秘安全 HTTP 头的设置

在当今数字化时代&#xff0c;前端安全至关重要。除了应对常见的攻击方式外&#xff0c;通过设置安全 HTTP 头&#xff0c;我们可以加强网站的安全性&#xff0c;减少潜在的威胁。本文将为您详细解释什么是安全 HTTP 头&#xff0c;以及如何通过设置它们来保护您的前端应用。 1…...

python爬虫——爬虫伪装和反“反爬”

前言 爬虫伪装和反“反爬”是在爬虫领域中非常重要的话题。伪装可以让你的爬虫看起来更像普通的浏览器或者应用程序&#xff0c;从而减少被服务器封禁的风险&#xff1b;反“反爬”则是应对服务器加强的反爬虫机制。下面将详细介绍一些常见的伪装和反反爬技巧&#xff0c;并提…...

vue3 使用 element-china-area-data 实现地区选择器

官方地址&#xff1a;https://www.npmjs.com/package/element-china-area-data?activeTabreadme 在线示例&#xff1a;https://plortinus.github.io/element-china-area-data/index.html 实际使用 <el-col :span"12"><el-form-item label"所处城市&…...

STM32自带的DSP库的滤波初体验(一)

最近在弄STM32自带的DSP库里的滤波&#xff0c;记录一下&#xff1a; arm_fir_instance_q15 instance_q15_S; #define NUM_TAPS 16 //滤波系数的个数 #define BLOCK_SIZE 32 q15_t firStateF32[BLOCK_SIZE NUM_TAPS]; q15_t Fir_Coeff[NUM_TAPS] {-79, -136, 312, 6…...

go kratos protobuf 接收动态JSON数据

前言 google.protobuf.Struct 是 Google Protocol Buffers 中的一种特殊类型&#xff0c;用于表示动态的键值对数据。它可以存储任意类型的数据&#xff0c;并提供了方便的方法来访问和操作这些数据。 Struct 类型通常用于在不事先知道数据结构的情况下传递和处理配置、参数或其…...

Python学习笔记第五十四天(Pandas DataFrame)

Python学习笔记第五十四天 Pandas 数据结构 - DataFrame使用列表创建使用 ndarrays 创建使用字典创建返回多行数 后记 Pandas 数据结构 - DataFrame DataFrame 是一个表格型的数据结构&#xff0c;它含有一组有序的列&#xff0c;每列可以是不同的值类型&#xff08;数值、字符…...

Docker镜像查看下载删除镜像文件的相关命令

1.镜像相关命令 本地查看有哪些镜像文件&#xff1a; docker images镜像的名称就是我们常见的一些软件&#xff0c;镜像相当于把软件和软件所需要的运行环境打包到一个镜像文件里面&#xff0c;将来在通过这个镜像文件创建出对应的容器&#xff0c;容器有了以后这些软件自动的…...

1. VisionOS平台介绍

介绍 VisionOS 可实现与现实世界无缝集成并与其他虚拟内容共存的 3D 多任务体验。这为个人生产力、生活方式和娱乐应用打开了一个充满新可能性的世界&#xff0c;并为开发人员打开了一个全新的市场。然而&#xff0c;它也带来了围绕多任务处理和与身体互动的新挑战。Unity Poly…...

Android Wi-Fi 连接失败日志分析

1. Android wifi 关键日志总结 (1) Wi-Fi 断开 (CTRL-EVENT-DISCONNECTED reason3) 日志相关部分&#xff1a; 06-05 10:48:40.987 943 943 I wpa_supplicant: wlan0: CTRL-EVENT-DISCONNECTED bssid44:9b:c1:57:a8:90 reason3 locally_generated1解析&#xff1a; CTR…...

HTML前端开发:JavaScript 常用事件详解

作为前端开发的核心&#xff0c;JavaScript 事件是用户与网页交互的基础。以下是常见事件的详细说明和用法示例&#xff1a; 1. onclick - 点击事件 当元素被单击时触发&#xff08;左键点击&#xff09; button.onclick function() {alert("按钮被点击了&#xff01;&…...

RNN避坑指南:从数学推导到LSTM/GRU工业级部署实战流程

本文较长&#xff0c;建议点赞收藏&#xff0c;以免遗失。更多AI大模型应用开发学习视频及资料&#xff0c;尽在聚客AI学院。 本文全面剖析RNN核心原理&#xff0c;深入讲解梯度消失/爆炸问题&#xff0c;并通过LSTM/GRU结构实现解决方案&#xff0c;提供时间序列预测和文本生成…...

Linux C语言网络编程详细入门教程:如何一步步实现TCP服务端与客户端通信

文章目录 Linux C语言网络编程详细入门教程&#xff1a;如何一步步实现TCP服务端与客户端通信前言一、网络通信基础概念二、服务端与客户端的完整流程图解三、每一步的详细讲解和代码示例1. 创建Socket&#xff08;服务端和客户端都要&#xff09;2. 绑定本地地址和端口&#x…...

技术栈RabbitMq的介绍和使用

目录 1. 什么是消息队列&#xff1f;2. 消息队列的优点3. RabbitMQ 消息队列概述4. RabbitMQ 安装5. Exchange 四种类型5.1 direct 精准匹配5.2 fanout 广播5.3 topic 正则匹配 6. RabbitMQ 队列模式6.1 简单队列模式6.2 工作队列模式6.3 发布/订阅模式6.4 路由模式6.5 主题模式…...

Mysql中select查询语句的执行过程

目录 1、介绍 1.1、组件介绍 1.2、Sql执行顺序 2、执行流程 2.1. 连接与认证 2.2. 查询缓存 2.3. 语法解析&#xff08;Parser&#xff09; 2.4、执行sql 1. 预处理&#xff08;Preprocessor&#xff09; 2. 查询优化器&#xff08;Optimizer&#xff09; 3. 执行器…...

探索Selenium:自动化测试的神奇钥匙

目录 一、Selenium 是什么1.1 定义与概念1.2 发展历程1.3 功能概述 二、Selenium 工作原理剖析2.1 架构组成2.2 工作流程2.3 通信机制 三、Selenium 的优势3.1 跨浏览器与平台支持3.2 丰富的语言支持3.3 强大的社区支持 四、Selenium 的应用场景4.1 Web 应用自动化测试4.2 数据…...

Rust 开发环境搭建

环境搭建 1、开发工具RustRover 或者vs code 2、Cygwin64 安装 https://cygwin.com/install.html 在工具终端执行&#xff1a; rustup toolchain install stable-x86_64-pc-windows-gnu rustup default stable-x86_64-pc-windows-gnu ​ 2、Hello World fn main() { println…...

通过 Ansible 在 Windows 2022 上安装 IIS Web 服务器

拓扑结构 这是一个用于通过 Ansible 部署 IIS Web 服务器的实验室拓扑。 前提条件&#xff1a; 在被管理的节点上安装WinRm 准备一张自签名的证书 开放防火墙入站tcp 5985 5986端口 准备自签名证书 PS C:\Users\azureuser> $cert New-SelfSignedCertificate -DnsName &…...

32单片机——基本定时器

STM32F103有众多的定时器&#xff0c;其中包括2个基本定时器&#xff08;TIM6和TIM7&#xff09;、4个通用定时器&#xff08;TIM2~TIM5&#xff09;、2个高级控制定时器&#xff08;TIM1和TIM8&#xff09;&#xff0c;这些定时器彼此完全独立&#xff0c;不共享任何资源 1、定…...