传输数据格式:JSON 异步加载

news2025/1/19 8:21:19

JSON

  • JSON是一种传输数据的格式(以对象为样板,本质上就是对象,但用途有区别,对象就是本地用的,json是用来传输的)
  • JSON.parse();string --> json
  • JSON.stringify();json --> string
json  ---> '{
	'name':"123",
	'age':12,
}'

JSON中规定属性名必须加个双引号 与对象不同

如果要将json数据传给后端,需要是一个字符串类型

var obj = {
	name : 'abc',
	age : 123
}

JSON.stringify(obj)

使用JSON.stringify()方法就能够把JSON类型的数据转化为字符串

 JSON.stringify(obj)

当后端传入了一个字符串类型的JSON格式数据 可以通过JSON.stringify(obj)方法把这个字符串转成json格式。

异步加载js

  • js加载的缺点:加载工具方法没必要阻塞文档,过得js加载会影响页面效率,一旦网速不好,那么 整个网站将等待js加载而不进行后续渲染等工作。
  • 有些工具方法需要按需加载,用到再加载,不用不加载。

js阻断html和css加载线的原因:
因为js会修改html和css

异步加载JavaScript的三种方案:

  • 1 defer 异步加载,但要等到dom文档全部解析完才会被执行。只能ie用,也可以将代码写到内部。

在script标签内部加一个 defer = “defer” / defer

  • 2 async 异步加载,加载完就执行,async只能加载外部脚本,不能把js卸载script标签里。

在script标签内部加一个 async= “async” / async

  • 1 2 执行时不会阻塞页面
  • 3 创建 script ,插入到dom中,加载完毕后callBack

在这里插入图片描述
创建一个script标签,当我们需要加载的时候再把它放到页面中。通过document.head.appendChild(script);

注意:
如果不使用document.head.appendChild(script);那么tools.js只会下载不会被放入html,
也就不会加载到页面上。

script.onload = function(){

}

script.onload方法而已保证 ,js文件加载完之后再执行。

封装完的函数:

function loadScript(url,callback){
	var script = document.createElement('script');
	script.type = "text/javascript";
	
	if(script.readyState){
		script.onreadystatechange = function (){//IE
			if(script.readyState == 'complete'  ||  script.readyState == 'loaded'){
					eval(callback);
					
					callback()
			}
		}
	}else{
		script.onload = function(){//Safari  chrome  firefox opera
			eval(callback);
		}
	
	}

	script.src = url;
	
	document.head.appendChild(script)

}


loadScript('demo.js',test)

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

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

相关文章

关于安卓的一些残缺笔记

安卓笔记Android应用项目的开发过程Android的调试Android项目文档结构Intent的显式/隐式调用Activity的生命周期1个Activity界面涉及到生命周期的情况2个Activity界面涉及到生命周期的情况Android布局的理论讲解Activity界面布局ContentProvider是如何实现数据共享Android整体架…

mysql视图和存储过程

视图视图就是将一条sql查询语句封装起来,之后使用sql时,只需要查询视图即可,查询视图时会将这条sql语句再次执行一遍。视图不保存数据,数据还是在表中。SELECT 语句所查询的表称为视图的基表,而查询的结果集称为虚拟表…

ATTCK v10版本战术实战研究—持久化(一)

一、前言“在网络安全的世界里,白帽子与黑帽子之间无时无刻都在进行着正与邪的对抗,似乎永无休止。正所谓,道高一尺魔高一丈,巨大的利益驱使着个人或组织利用技术进行不法行为,花样层出不穷,令人防不胜防。…

udk2017环境搭建编译步骤

win10 64bit系统 1.参考minnowboard-max-rel-1-01-bin-releasenotes-for-binary-firmware-images.TXT MyWorkspace.rar 解压到c:\,参考txt中的git操作 3.复制ASL,NASM 到c:\ 安装vs2015 ,勾选sdk 5.安装 python-2.7.10.amd64.msi&#xf…

【论文泛读】NeRF: Representing Scenes as Neural Radiance Fields for View Synthesis

NeRF: Representing Scenes as Neural Radiance Fields for View Synthesis | NeRF: 用于视图合成的神经辐射场的场景表示 | 2020年 出自文献:Mildenhall B, Srinivasan P P, Tancik M, et al. Nerf: Representing scenes as neural radiance fields for view synth…

泼辣修图Polarr5.11.4 版,让你的创意无限延伸

泼辣修图是一款非常实用的图片处理软件,它不仅拥有丰富的图片处理功能,而且还能够轻松地实现自定义操作。泼辣修图的操作界面非常简洁,功能也非常丰富,使用起来非常方便快捷。 泼辣修图拥有非常丰富的图片处理功能,包括…

【冲刺蓝桥杯的最后30天】day1

大家好😃,我是想要慢慢变得优秀的向阳🌞同学👨‍💻,断更了整整一年,又开始恢复CSDN更新,从今天开始逐渐恢复更新状态,正在备战蓝桥杯的小伙伴可以支持一下哦!…

Rockchip Android13 GKI开发指南

Rockchip Android13 GKI开发指南 文章目录Rockchip Android13 GKI开发指南GKI介绍Google upstream kernel下载及编译Rockchip SDK中GKI相关目录介绍Rockchip GKI编译代码修改编译固件烧写KO编译及修改添加新的模块驱动的方法调试ko方法开机log确认uboot阶段Android阶段KO加载KO…

Java IO流详解

文章目录一、File1.1 构造方法1.2 文件操作 方法1.3 目录操作 方法1.4 文件检测 方法1.5 获取文件信息 方法1.6 应用练习二、IO 流2.1 InputStream 字节输入流 (读)🍓FileInputStream🍓BufferedInputStream2.2 OutputStream 字节输出流 (写)&#x1f34c…

【Redis】redis大key和大value的危害,如何处理?

前序 还记得上次和同事一起去面试候选人时,同事提了一个问题:Redis的大key有什么危害?当时候选人主要作答的角度是一个key的value较大时的情况,比如: 内存不均:单value较大时,可能会导致节点之…

[经验分享]gpt-3.5-Turbo|unity中实现http接口调用gpt新接口以及信息处理的实现案例分享

最近openAI发布了目前chatGPT所使用的模型gpt-3.5-Turbo,之前使用了text-davinci-003模型做了一个galgame的AI女友对话的demo。这次趁着新接口的发布,对这个demo也同步更新了模型调用的代码。本篇文章将分享一下,如何在unity里使用UnityWebRe…

记录一次PWM信号异常问题

问题我使用单片机输出PWM控制机械臂,但是控制过程中,机械臂总是会出现莫名的抽动。利用示波器测试PWM信号,发现信号正常。过程(1)在反复的测试过程中,队友提出,将示波器的地线放在左侧的GND波形…

计算机EI会议论文,和EI期刊论文有什么区别? - 易智编译EaseEditing

EI期刊论文,是期刊论文的一种。顾名思义,就是指发在期刊上的论文。 期刊论文发表的格式需要具体参考各期刊文章的要求学术论文格式,主要会发在月刊/季刊/年刊/不定期的刊上。 目前,国际著名的科技文献检索系统是SCI(…

安卓-AndroidManifest.xml修复

解析编译之后的AndroidManifest文件格式:http://www.520monkey.com/archives/575 案例apk jadx打开发现AndroidManifest.xml异常,无法正常显示 那么我们用apktool反编译试试 apktool d APK逆向-2.apk -f可以看到报错了,显示不能解析此xml…

[SSD科普] 固态硬盘物理接口SATA、M.2、PCIe常见疑问,如何选择?

前言犹记得当年Windows 7系统体验指数中,那5.9分磁盘分数,在其余四项的7.9分面前,似乎已经告诉我们机械硬盘注定被时代淘汰。势如破竹的SSD固态硬盘,彻底打破了温彻斯特结构的机械硬盘多年来在电脑硬件领域的统治。SSD数倍于HDD机…

数据结构 “串“ 的补充提升与KMP算法及其优化的具体实现

❤️作者主页:微凉秋意 ✅作者简介:后端领域优质创作者🏆,CSDN内容合伙人🏆,阿里云专家博主🏆 ✨精品专栏:C面向对象 🔥系列专栏:数据结构与课程设计 文章目录…

XSS漏洞基本概念

目录 XSS的原理和分类 XSS漏洞分类 dom 存储型 XSS的危害 XSS漏洞的验证 XSS的黑盒测试 XSS漏洞的白盒测试 XSS的原理和分类 xss全称跨站脚本攻击xss(Cross Site Scripting) 为了不和层叠样式表(Cascading Style Sheets, CSS)的缩写混淆&am…

MCU实现对外部脉冲信号的计数功能

有的传感器会输出脉冲信号,MCU需要统计脉冲输入的个数,通常有如下实现方式: 1.GPIO中断 原理很简单,利用GPIO的上升沿或者下降沿中断,进中断的次数就是脉冲的个数。只需要在中断服务函数里计数即可。 使用GPIO中断需…

Streaming System是第一章翻译

GIthub链接,欢迎志同道合的小伙伴一起翻译 Chapter 1.Streaming101 如今,流数据处理在大数据中是非常重要的,其主要原因是: 企业渴望对他们的数据有更及时的了解,而转换到流处理是实现更低延迟的一个好方法&#xf…

使用vite+vue3.0 创建一个cesium基础应用 ----01 项目搭建

使用vitevue3.0 创建一个cesium基础应用 ----01 项目搭建 1.使用yarn创建一个vite项目 我们可以在vite官网找到vite创建项目的命令 https://cn.vitejs.dev/ 可以使用yarn创建项目选择使用vue3.0框架,语言使用js 创建完成后结构如下: 2.找到vite社区中的…