在JS中写HTML，然后插入到目标HTML中

最新推荐文章于 2022-09-17 10:56:21 发布
最新推荐文章于 2022-09-17 10:56:21 发布
阅读量533 收藏
点赞数
分类专栏： JS 文章标签： html jquery
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/dongnihao/article/details/120728220
版权

思路，为了再次封装。所以把HTML写到相对应的JS文件中。第一步创建一个变量

const html= ` HTML内容各种标签 `

然后实际上你的得到的是一串String字符串，无法直接添加，这边使用JQuery来创建结点。

const $element = $(html).prependTo(这里面写你想插入到的标签之前)

小问题：如果在弱3G情况下，这样的模块化代码会出现几秒的空白，如何解决？

答：加一个菊花图，提示用户我在Loading，等加载完了，在JS中，找到image元素，然后删除。          或者使用SSR技术，服务端渲染技术。太麻烦了

董厂长
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 1
    评论
专栏目录
向HTML中插入视频并兼容所有浏览器的方法
09-28
在HTML中插入视频是网页设计中常见的需求，主要目的是为了提供多媒体体验，增强网站的互动性和吸引力。有两种主要方法可以实现这一目标：使用`<object>`标签和HTML5的`<video>`标签。 `<object>`标签是较早的HTML...
如何使用JavaScript将HTML代码附加到div里？
m0_66319974的博客
01-11 2953
如何使用JavaScript将HTML代码附加到div里？
怎么用JS输入HTML代码
xiaoweids的博客
09-17 3106
document.write("需要输出的内容")
蛇形填数
weixin_44764207的博客
10-05 304
描述 在n x n方针里填入1，2，……，nxn，要求填成蛇形。例如，n=4时方阵为： 10 11 12 1 9 16 13 2 8 15 14 3 7 6 5 4 实现代码 #include<stdio.h> #include<string.h> #define maxn 20 int a[maxn][maxn]; int main(){ int n, x, y, tot = 0; scanf("%d", &n); memset(a, 0, siz
JS无限添加HTML到指定位置
qq_39702981的博客
03-25 2358
用JS把HTML添加到指定位置有两种写法，一种是用字符串，一种是用javascript中的方法 第一种： 用字符串写 <h2>利用JS无限添加一个相同部分</h2> <h5>第一种写法</h5> <%--有多少个相同的这里面的值就是几--%> <asp:HiddenField ...
怎样用javascript在html中插入一段代码
woshirsn的博客
09-18 6162
div style="position:relative;"> div id="container1997">div> img src="img/2.png" onclick="showEarth(1997)" style="width:50px; height:10px;"> div> 在div id="container1997">div>中插入一段代码<img src="
JavaScript实现获取远程的html到当前页面中
10-20
在本文中，我们将探讨如何使用JavaScript实现从远程服务器获取HTML页面，并将其内容插入到当前页面的指定位置。 首先，我们需要理解XMLHttpRequest对象，它是JavaScript中用于异步请求数据的核心工具。...
html中使用js来获取本地系统时间
12-13
在这个场景中，我们将探讨如何在HTML中使用JavaScript获取本地系统时间，并展示在页面上。 首先，让我们分析给定的代码片段： ```html 名称"> <script language=Javascript> var now = new Date(); document....
book:《构造手册》中静态生成HTML的目标位置
04-04
这些工具能够解析源文件，应用模板，插入数据，然后输出优化过的HTML、CSS和JavaScript，以创建完整的静态网站。在《构造手册》中，很可能详细介绍了如何配置和使用这些工具，以及如何管理项目结构和元数据。 “该...
仿华为商城部分前端界面html+css+js
最新发布
06-28
在本项目"仿华为商城部分前端界面html+css+js"中，我们主要探讨的是如何利用Web前端技术来构建一个类似华为商城的电子商务网站的用户界面。这个项目着重于实现HTML结构、CSS样式以及JavaScript交互功能，从而为用户...
如何在指定的地方插入html内容和文本内容
12-01
dhtml提供了两个方法来进行添加，insertAdjacentHTML和insertAdjacentText insertAdjacentHTML方法：在指定的地方插入html标签语句。 原型：insertAdjacentHTML(swhere,stext) 参数： swhere:指定插入html标签语句的地方，有四种值可以用： 1.beforeBegin:插入到标签开始前 2.afterBegin:插入到标签开始标记后 3.beforeEnd:插入到标签结束标记前 4.afterEnd:插入到标签结束标记后 stext:要插入的内容 例： 代码如下: var sHTML=”<input
总结在js中插入HTML的方法
u012750259的专栏
11-29 4643
1、object1.innerHTML  = object2 innerHTML只能是显示不含html标签的标签内容 2、直接建立一个div，在div中写所有html代码，使用document.body.appendchild 方法把div加到body标签的最后 3、用jquery 的方式。$("放的位置").html('内容') 4、编辑大型HTML文件时使用template.loa
js写入指定html,js 指定位置插入html标签（可编辑div）
weixin_39937635的博客
06-03 3383
demo效果如下：html代码部分如下：js获取编辑框游标的位置#Div1, #Div2{width: 500px;height: 100px;border: solid 1px black;}插入字符dasdsadasdasdasddasdasdasdasdsadsa$('#ddddd').click(function(){document.getElementById('test').focu...
js 添加元素 到html代码,如何使用JavaScript将HTML代码附加到div里？
weixin_28933027的博客
07-08 2297
在JavaScript中将HTML代码附加到div里的方法有两个：使用innerHTML属性或使用insertAdjacentHTML()方法。下面本篇文章就来给大家具体介绍一下，希望对大家有所帮助。1、使用innerHTML属性要使用innerhtml属性追加HTML代码，首先选择要追加代码的元素(div)。然后，使用innerhtml上的+=运算符添加将字符串括起来的代码。语法：element...
js在html插入数据,在JavaScript中打开窗口并插入HTML
weixin_34901388的博客
06-04 584
您可以通过以下代码打开一个新的弹出窗口：var myWindow = window.open("", "newWindow", "width=500,height=700");//window.open('url','name','specs');之后，您可以同时使用id或id="mainBody"添加HTML我将建议您首先使用任何名称创建一个新的html文件。在此示例中，我正在使用newFile...
如何使用js添加html标签
热门推荐
越努力越幸运的博客
06-01 2万+
文章目录如何使用js添加html标签 如何使用js添加html标签 其实很简单，只需要以下几个步骤： 1.使用getElementById获取想要写的标签的父标签对象（body除外，当然body也可以获取，当时没必要，因为他可以通过document.body直接调用） 2.使用createElement创建标签对象 3.设置标签的属性和文本信息 4.使用步骤1获取到的父标签对象的appendChild方法添加标签 详细代码如下： <!DOCTYPE html> <html lang="en
JavaScript：使用js脚本写入HTML代码
有意栽花花不发，无心插柳柳成荫。
02-17 3410
Hello，大家好，我是wangzirui32，今天我们来学习如何让js脚本自动写入HTML代码。 首先，打开一个js文件，命名为hello.js，输入： // 一个用于测试写入HTML代码的hello函数 // 用法：调用时在HTML页面上写入“你好！” function hello(){ // document.write函数 用来写入括号中的HTML源码（为字符串） document.write("<h1>Hello！</h1>"); } // 调用一次 hello();
js怎样向html中添加内容,使用js向网页中写入html内容
weixin_39663729的博客
06-09 5542
前言js可以向网页中写入html内容，方法是调用write方法向document的节点中写入html元素以下展示两个实例实例1.在网页上写入一个标题为hello的元素document.write(" hello ")效果如图：2.在网页上写入一个九九乘法表document.write("")for(var i=1;i<=9; i++){document.write("")for(var j=...
在方法中编译好了我要插入的html怎么渲染
05-26
如果你在方法中已经编译好了要插入的 HTML，那么你可以使用 JavaScript 中的 DOM 操作来将它渲染到页面上。可以先创建一个 HTML 元素，将编译好的 HTML 作为其 innerHTML 属性值，然后将该元素插入到要显示的位置。...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

董厂长

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值