原生js 在b.html 读取a.html文件内容,并添加到b.html的部分位置

1、第一种方式XMLHttpReques

t

var xhr = new XMLHttpRequest();
xhr.open("GET", "a.html", true);
xhr.onreadystatechange = function () {if (xhr.readyState == 4 && xhr.status == 200) {var content = xhr.responseText;// 将内容添加到 b.html 的指定位置var targetElement = document.getElementById("yourTargetElementId");targetElement.innerHTML += content;}
};
xhr.send();

2、第二种方式iframe

<!DOCTYPE html>
<html><body><h2>b.html</h2><iframe src="a.html" id="myIframe"></iframe><script>var iframe = document.getElementById("myIframe");// 在 iframe 加载完成后执行操作iframe.onload = function () {var content = iframe.contentDocument.body.innerHTML;// 将内容添加到 b.html 的指定位置var targetElement = document.getElementById("yourTargetElementId");targetElement.innerHTML += content;}</script></body></html>

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/808109.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Vue3 使用ElementUI 显示异常

element提供的样例不能正常显示&#xff0c;需要进行配置 1.npm install element-plus --save 2.main.js // main.ts import { createApp } from vue import ElementPlus from element-plus //全局引入 import element-plus/dist/index.css import App from ./App.vue const …

道可云文旅元宇宙平台:全面赋能文旅产业数字化转型

随着科技的迅猛发展&#xff0c;元宇宙、人工智能和虚拟数字人等技术逐渐成为推动社会进步的重要力量。在这一背景下&#xff0c;道可云文旅元宇宙平台以其独特的创新理念和前沿技术&#xff0c;为数字文博领域带来了革命性的变革。 道可云文旅元宇宙平台运用先进的元宇宙、人…

了解google的SerpApi是个啥

SerpApi是一个实时API&#xff0c;可以访问Google搜索结果。它为客户处理代理、解决验证码问题&#xff0c;并解析所有丰富的结构化数据。这个API让用户可以轻松地获取Google搜索结果&#xff0c;而无需直接与Google搜索进行交互&#xff0c;也不需要处理复杂的爬虫和验证码问题…

[2024年4月最新]Python安装教程

一、Python下载 1、进入Python官网 官网地址&#xff1a;https://www.python.org 2、点击【Downloads】展开后点击【Windows】跳转到下载python版本页面&#xff0c;选择"Stable Releases"稳定版本&#xff0c;我下载的是Python 3.10.10版本&#xff0c;所以找到【…

JavaScript教程(四)--- 函数

函数 函数是 JavaScript 中的基本组件之一。JavaScript 中的函数类似于过程——一组执行任务或计算值的语句。但要成为函数&#xff0c;这个过程应该接受输入并返回与输入存在某些明显关系的输出。要使用一个函数&#xff0c;你必须将其定义在你希望调用它的作用域内。 定义函…

[xboard]real6410-6.1 移植kernel 5.4.272

文章目录 获取源码方法一方法二方法三了解S3C6410内核相关1 设备文件2 mach-文件3 plat-文件配置real6410编译镜像测试问题1获取源码 方法一 进入官网,如下界面,点击http, 再依次

IPV6的相关网络问题

问题 ​​​​​​​ 目录 问题 一.什么是NAT64转换 1.NAT64的工作原理 IPv6到IPv4转换 IPv4到IPv6的响应转换 2.NAT64的优点 3.NAT64的缺点 二.NAT64转换如何实现 1.工作原理 2.实现步骤 DNS查询转换&#xff08;DNS64&#xff09; 地址转换&#xff08;NAT64&a…

Ubuntu 20.04 永久修改 最大文件打开数量和最大线程数量

目录 一、查看设置 二、永久设置 三、验证测试 操作系统&#xff1a;Ubuntu 20.04.5 LTS 我们在Ubuntu 20.04系统上&#xff0c;永久修改“最大文件打开数量”open files和“最大线程数量”max user processes。 一、查看设置 查看当前用户的设置 ulimit -a open files 是…

掌握ChatGPT技巧:写作论文如虎添翼

ChatGPT无限次数:点击直达 掌握ChatGPT技巧&#xff1a;写作论文如虎添翼 引言 在当今信息爆炸的时代&#xff0c;论文写作成为每个研究者必不可少的重要技能。然而&#xff0c;有时候我们可能会遇到灵感枯竭、思路不清晰的困境。幸运的是&#xff0c;随着人工智能技术的不断…

BTI的启用与构建

BTI分支目标识别精讲与实践系列 思考 1、什么是代码重用攻击&#xff1f;什么是ROP攻击&#xff1f;区别与联系&#xff1f; 2、什么是JOP攻击&#xff1f;间接分支跳转指令&#xff1f; 3、JOP攻击的缓解技术&#xff1f;控制流完整性保护&#xff1f; 4、BTI下的JOP如何…

三行命令解决Ubuntu Linux联网问题

本博客中Ubuntu版本为23.10.1最新版本&#xff0c;后续发现了很多问题我无法解决&#xff0c;已经下载了另外一个版本22.04&#xff0c;此版本自带网络 一开始我找到官方文档描述可以通过命令行连接到 WiFi 网络&#xff1a;https://cn.linux-console.net/?p10334#google_vig…

Docker容器(六)网络配置与数据卷

一、高级网络配置 1.1概述 当 Docker 启动时&#xff0c;会自动在主机上创建一个 docker0 虚拟网桥&#xff0c;实际上是 Linux 的一个 bridge&#xff0c;可以理解为一个软件交换机。它会在挂载到它的网口之间进行转发。 同时&#xff0c;Docker 随机分配一个本地未占用的私有…

蓝桥杯历年真题值DFS

2020年分配口罩 【问题描述】 某市市长获得了若干批口罩&#xff0c;每一批口罩的数目如下&#xff1a;&#xff08;如果你把以下文字复制到文本文件中&#xff0c;请务必检查复制的内容是否与文档中的一致。在试题目录下有一个文件 mask.txt&#xff0c;内容与下面的文本相同…

使用二进制设计权限

学习笔记来源&#xff1a;https://www.bilibili.com/video/BV19h4y1A7Gq/?spm_id_from333.337.search-card.all.click&vd_sourcea0f31140205458776d3a4ef477cd6561 假如已知四个权限&#xff1a; const READ 1; const WRITE 2; const DELETE 3; const CREATE 4;而表示…

构建第一个ArkTS之基本语法概述

在初步了解了ArkTS语言之后&#xff0c;我们以一个具体的示例来说明ArkTS的基本组成。如下图所示&#xff0c;当开发者点击按钮时&#xff0c;文本内容从“Hello World”变为“Hello ArkUI”。 图1 示例效果图 本示例中&#xff0c;ArkTS的基本组成如下所示。 图2 ArkTS的基本…

计算机网络技术-电路交换、报文交换和分组交换的介绍+区别

目录 电路交换报文交换分组交换待续、更新中 电路交换 电路交换是由交换机负责在两个通信站点之间建立一条物理专用线路。 报文交换 报文交换是以报文为单位进行存储交换的技术&#xff0c;指的是一次通信的全部数据(报文)按存储转发的方式实现传输。 分组交换 分组交换方…

C++ 封装

1.封装 cpp认为万事万物都可以封装 封装将属性和行为作为一个整体&#xff0c;表现生活中的事物。 将属性和行为加以权限控制。 语法&#xff1a; class 类名{ 访问权限: 属性或者行为 } //学生类 class Student { public:void setName(string name) {m_name name;}vo…

人工智能技术创业机会有哪些?

&#x1f482; 个人主页: 同学来啦&#x1f91f; 版权: 本文由【同学来啦】原创、在CSDN首发、需要转载请联系博主 &#x1f4ac; 如果文章对你有帮助&#xff0c;欢迎关注、点赞、收藏和订阅专栏哦 文章目录 &#x1f96d; 一、城市治理&#x1f34e; 二、社交创新&#x1f3…

如何申请苹果个人开发者账户

1、苹果手机下载Developer APP&#xff0c;登录后&#xff0c;账户-注册-支付688 2、查看邮箱&#xff0c;会有邮件提醒上传身份证正反面&#xff0c;上传成功后会有邮件回复 3、审核时间为2天&#xff0c;如果没回复&#xff0c;及时联系客服&#xff0c;秒回复 https://de…

分享快速搭建鸿蒙应用的几种方式

鸿蒙今年快速发展&#xff0c;特别是不再兼容安卓&#xff0c;鸿蒙原生应用成为大家关注的重点。今天分享几个如何实现快速开发鸿蒙App的方法。 鸿蒙开发有多种开发模式&#xff1a;一种是使用ArkTS声明式&#xff1b;如果这种感觉还需要花时间学习的话&#xff0c;那么另一种…