百度360必应搜狗淘宝本站头条
nodejsbufferorg.jsoupsetnocountoncv2.bitwise_nottime.strptime
当前位置：网站首页 > 编程字典 > 正文

程序员浪漫起来没文科生什么事HTML制作表白爱心-无需编程基础

toyiye 2024-06-21 12:06 8 浏览 0 评论

都说程序员是大大的直男，但是一旦程序员浪漫起来，他们会用他们狂拽酷炫吊的技能展现自己的罗曼蒂克实力，那时候就真的没文科男什么事啦！下面我就跟大家分享如何用简单的html制作一个网页版的爱心表白，不管你是不是程序员都能用，手机就可展示。

先来看下效果：

后面会提供给大家源代码，在这里先交大家怎么去根据自己的实际情况去改这个文件。

复制源代码

首先大家将我后面的源代码复制下来并且粘贴进一个txt文件就可以。

jquery.js下载

不要看到下载就害怕，这个大家只要搜索jquery就能下载了，下载完是一个jquery.js文件，将文件改名为jquery.txt，双击打开将内容复制到下图所示位置。（如果有人不会下，可以私信我索要）

更改表白信息

大家根据自己的实际请款更改页面的一些信息，比如姓名，日期、或者是表白内容都可以

源码

最后奉上源码，这里是没有jquery.js的，已经预留空，需要大家复制粘贴进来就行了，最后将txt文件的后缀改为.html就可以了，不管是电脑还是手机都能用哦。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Love</title>
<style type="text/css">
@font-face {
	font-family: digit;
	src: url('digital-7_mono.ttf') format("truetype");
}
body{margin:0;padding:0;background:#ffe;font-size:12px;overflow:auto}
#mainDiv{width:100%;height:100%}
#loveHeart{float:left;width:670px;height:625px}
#garden{width:100%;height:100%}
#elapseClock{text-align:right;font-size:18px;margin-top:10px;margin-bottom:10px}
#words{font-family:"sans-serif";width:500px;font-size:24px;color:#666}
#messages{display:none}
#elapseClock .digit{font-family:"digit";font-size:36px}
#loveu{padding:5px;font-size:22px;margin-top:80px;margin-right:120px;text-align:right;display:none}
#loveu .signature{margin-top:10px;font-size:20px;font-style:italic}
#clickSound{display:none}
#code{float:left;width:440px;height:400px;color:#333;font-family:"Consolas","Monaco","Bitstream Vera Sans Mono","Courier New","sans-serif";font-size:12px}
#code .string{color:#2a36ff}
#code .keyword{color:#7f0055;font-weight:bold}
#code .placeholder{margin-left:15px}#code .space{margin-left:7px}
#code .comments{color:#3f7f5f}
#copyright{margin-top:10px;text-align:center;width:100%;color:#666}
#errorMsg{width:100%;text-align:center;font-size:24px;position:absolute;top:100px;left:0}
#copyright a{color:#666}
</style>
<script language="javascript" type="text/javascript">
</script>
<script language="javascript" type="text/javascript">
	 function Vector(x, y) {
	 this.x = x;
	 this.y = y;
	 };
		
	 Vector.prototype = {
	 rotate: function (theta) {
	 var x = this.x;
	 var y = this.y;
	 this.x = Math.cos(theta) * x - Math.sin(theta) * y;
	 this.y = Math.sin(theta) * x + Math.cos(theta) * y;
	 return this;
	 },
	 mult: function (f) {
	 this.x *= f;
	 this.y *= f;
	 return this;
	 },
	 clone: function () {
	 return new Vector(this.x, this.y);
	 },
	 length: function () {
	 return Math.sqrt(this.x * this.x + this.y * this.y);
	 },
	 subtract: function (v) {
	 this.x -= v.x;
	 this.y -= v.y;
	 return this;
	 },
	 set: function (x, y) {
	 this.x = x;
	 this.y = y;
	 return this;
	 }
	 };
		
	 function Petal(stretchA, stretchB, startAngle, angle, growFactor, bloom) {
	 this.stretchA = stretchA;
	 this.stretchB = stretchB;
	 this.startAngle = startAngle;
	 this.angle = angle;
	 this.bloom = bloom;
	 this.growFactor = growFactor;
	 this.r = 1;
	 this.isfinished = false;
	 //this.tanAngleA = Garden.random(-Garden.degrad(Garden.options.tanAngle), Garden.degrad(Garden.options.tanAngle));
	 //this.tanAngleB = Garden.random(-Garden.degrad(Garden.options.tanAngle), Garden.degrad(Garden.options.tanAngle));
	 }
	 Petal.prototype = {
	 draw: function () {
	 var ctx = this.bloom.garden.ctx;
	 var v1, v2, v3, v4;
	 v1 = new Vector(0, this.r).rotate(Garden.degrad(this.startAngle));
	 v2 = v1.clone().rotate(Garden.degrad(this.angle));
	 v3 = v1.clone().mult(this.stretchA); //.rotate(this.tanAngleA);
	 v4 = v2.clone().mult(this.stretchB); //.rotate(this.tanAngleB);
	 ctx.strokeStyle = this.bloom.c;
	 ctx.beginPath();
	 ctx.moveTo(v1.x, v1.y);
	 ctx.bezierCurveTo(v3.x, v3.y, v4.x, v4.y, v2.x, v2.y);
	 ctx.stroke();
	 },
	 render: function () {
	 if (this.r <= this.bloom.r) {
	 this.r += this.growFactor; // / 10;
	 this.draw();
	 } else {
	 this.isfinished = true;
	 }
	 }
	 }
	 function Bloom(p, r, c, pc, garden) {
	 this.p = p;
	 this.r = r;
	 this.c = c;
	 this.pc = pc;
	 this.petals = [];
	 this.garden = garden;
	 this.init();
	 this.garden.addBloom(this);
	 }
	 Bloom.prototype = {
	 draw: function () {
	 var p, isfinished = true;
	 this.garden.ctx.save();
	 this.garden.ctx.translate(this.p.x, this.p.y);
	 for (var i = 0; i < this.petals.length; i++) {
	 p = this.petals[i];
	 p.render();
	 isfinished *= p.isfinished;
	 }
	 this.garden.ctx.restore();
	 if (isfinished == true) {
	 this.garden.removeBloom(this);
	 }
	 },
	 init: function () {
	 var angle = 360 / this.pc;
	 var startAngle = Garden.randomInt(0, 90);
	 for (var i = 0; i < this.pc; i++) {
	 this.petals.push(new Petal(Garden.random(Garden.options.petalStretch.min, Garden.options.petalStretch.max), Garden.random(Garden.options.petalStretch.min, Garden.options.petalStretch.max), startAngle + i * angle, angle, Garden.random(Garden.options.growFactor.min, Garden.options.growFactor.max), this));
	 }
	 }
	 }
	 function Garden(ctx, element) {
	 this.blooms = [];
	 this.element = element;
	 this.ctx = ctx;
	 }
	 Garden.prototype = {
	 render: function () {
	 for (var i = 0; i < this.blooms.length; i++) {
	 this.blooms[i].draw();
	 }
	 },
	 addBloom: function (b) {
	 this.blooms.push(b);
	 },
	 removeBloom: function (b) {
	 var bloom;
	 for (var i = 0; i < this.blooms.length; i++) {
	 bloom = this.blooms[i];
	 if (bloom === b) {
	 this.blooms.splice(i, 1);
	 return this;
	 }
	 }
	 },
	 createRandomBloom: function (x, y) {
	 this.createBloom(x, y, Garden.randomInt(Garden.options.bloomRadius.min, Garden.options.bloomRadius.max), Garden.randomrgba(Garden.options.color.rmin, Garden.options.color.rmax, Garden.options.color.gmin, Garden.options.color.gmax, Garden.options.color.bmin, Garden.options.color.bmax, Garden.options.color.opacity), Garden.randomInt(Garden.options.petalCount.min, Garden.options.petalCount.max));
	 },
	 createBloom: function (x, y, r, c, pc) {
	 new Bloom(new Vector(x, y), r, c, pc, this);
	 },
	 clear: function () {
	 this.blooms = [];
	 this.ctx.clearRect(0, 0, this.element.width, this.element.height);
	 }
	 }
	 Garden.options = {
	 petalCount: {
	 min: 8,
	 max: 15
	 },
	 petalStretch: {
	 min: 0.1,
	 max: 3
	 },
	 growFactor: {
	 min: 0.1,
	 max: 1
	 },
	 bloomRadius: {
	 min: 8,
	 max: 10
	 },
	 density: 10,
	 growSpeed: 1000 / 60,
	 color: {
				rmin: 128,
				rmax: 255,
				gmin: 0,
				gmax: 128,
				bmin: 0,
				bmax: 128,
	 opacity: 0.1
	 },
	 tanAngle: 60
	 };
	 Garden.random = function (min, max) {
	 return Math.random() * (max - min) + min;
	 };
	 Garden.randomInt = function (min, max) {
	 return Math.floor(Math.random() * (max - min + 1)) + min;
	 };
	 Garden.circle = 2 * Math.PI;
	 Garden.degrad = function (angle) {
	 return Garden.circle / 360 * angle;
	 };
	 Garden.raddeg = function (angle) {
	 return angle / Garden.circle * 360;
	 };
	 Garden.rgba = function (r, g, b, a) {
	 return 'rgba(' + r + ',' + g + ',' + b + ',' + a + ')';
	 };
	 Garden.randomrgba = function (rmin, rmax, gmin, gmax, bmin, bmax, a) {
			var r = Math.round(Garden.random(rmin, rmax));
			var g = Math.round(Garden.random(gmin, gmax));
			var b = Math.round(Garden.random(bmin, bmax));
			var limit = 5;
			if (Math.abs(r - g) <= limit && Math.abs(g - b) <= limit && Math.abs(b - r) <= limit) {
				return Garden.rgba(rmin, rmax, gmin, gmax, bmin, bmax, a);
			} else {
				return Garden.rgba(r, g, b, a);
			}
	 };	 function Vector(x, y) {
	 this.x = x;
	 this.y = y;
	 };
		
	 Vector.prototype = {
	 rotate: function (theta) {
	 var x = this.x;
	 var y = this.y;
	 this.x = Math.cos(theta) * x - Math.sin(theta) * y;
	 this.y = Math.sin(theta) * x + Math.cos(theta) * y;
	 return this;
	 },
	 mult: function (f) {
	 this.x *= f;
	 this.y *= f;
	 return this;
	 },
	 clone: function () {
	 return new Vector(this.x, this.y);
	 },
	 length: function () {
	 return Math.sqrt(this.x * this.x + this.y * this.y);
	 },
	 subtract: function (v) {
	 this.x -= v.x;
	 this.y -= v.y;
	 return this;
	 },
	 set: function (x, y) {
	 this.x = x;
	 this.y = y;
	 return this;
	 }
	 };
		
	 function Petal(stretchA, stretchB, startAngle, angle, growFactor, bloom) {
	 this.stretchA = stretchA;
	 this.stretchB = stretchB;
	 this.startAngle = startAngle;
	 this.angle = angle;
	 this.bloom = bloom;
	 this.growFactor = growFactor;
	 this.r = 1;
	 this.isfinished = false;
	 //this.tanAngleA = Garden.random(-Garden.degrad(Garden.options.tanAngle), Garden.degrad(Garden.options.tanAngle));
	 //this.tanAngleB = Garden.random(-Garden.degrad(Garden.options.tanAngle), Garden.degrad(Garden.options.tanAngle));
	 }
	 Petal.prototype = {
	 draw: function () {
	 var ctx = this.bloom.garden.ctx;
	 var v1, v2, v3, v4;
	 v1 = new Vector(0, this.r).rotate(Garden.degrad(this.startAngle));
	 v2 = v1.clone().rotate(Garden.degrad(this.angle));
	 v3 = v1.clone().mult(this.stretchA); //.rotate(this.tanAngleA);
	 v4 = v2.clone().mult(this.stretchB); //.rotate(this.tanAngleB);
	 ctx.strokeStyle = this.bloom.c;
	 ctx.beginPath();
	 ctx.moveTo(v1.x, v1.y);
	 ctx.bezierCurveTo(v3.x, v3.y, v4.x, v4.y, v2.x, v2.y);
	 ctx.stroke();
	 },
	 render: function () {
	 if (this.r <= this.bloom.r) {
	 this.r += this.growFactor; // / 10;
	 this.draw();
	 } else {
	 this.isfinished = true;
	 }
	 }
	 }
	 function Bloom(p, r, c, pc, garden) {
	 this.p = p;
	 this.r = r;
	 this.c = c;
	 this.pc = pc;
	 this.petals = [];
	 this.garden = garden;
	 this.init();
	 this.garden.addBloom(this);
	 }
	 Bloom.prototype = {
	 draw: function () {
	 var p, isfinished = true;
	 this.garden.ctx.save();
	 this.garden.ctx.translate(this.p.x, this.p.y);
	 for (var i = 0; i < this.petals.length; i++) {
	 p = this.petals[i];
	 p.render();
	 isfinished *= p.isfinished;
	 }
	 this.garden.ctx.restore();
	 if (isfinished == true) {
	 this.garden.removeBloom(this);
	 }
	 },
	 init: function () {
	 var angle = 360 / this.pc;
	 var startAngle = Garden.randomInt(0, 90);
	 for (var i = 0; i < this.pc; i++) {
	 this.petals.push(new Petal(Garden.random(Garden.options.petalStretch.min, Garden.options.petalStretch.max), Garden.random(Garden.options.petalStretch.min, Garden.options.petalStretch.max), startAngle + i * angle, angle, Garden.random(Garden.options.growFactor.min, Garden.options.growFactor.max), this));
	 }
	 }
	 }
	 function Garden(ctx, element) {
	 this.blooms = [];
	 this.element = element;
	 this.ctx = ctx;
	 }
	 Garden.prototype = {
	 render: function () {
	 for (var i = 0; i < this.blooms.length; i++) {
	 this.blooms[i].draw();
	 }
	 },
	 addBloom: function (b) {
	 this.blooms.push(b);
	 },
	 removeBloom: function (b) {
	 var bloom;
	 for (var i = 0; i < this.blooms.length; i++) {
	 bloom = this.blooms[i];
	 if (bloom === b) {
	 this.blooms.splice(i, 1);
	 return this;
	 }
	 }
	 },
	 createRandomBloom: function (x, y) {
	 this.createBloom(x, y, Garden.randomInt(Garden.options.bloomRadius.min, Garden.options.bloomRadius.max), Garden.randomrgba(Garden.options.color.rmin, Garden.options.color.rmax, Garden.options.color.gmin, Garden.options.color.gmax, Garden.options.color.bmin, Garden.options.color.bmax, Garden.options.color.opacity), Garden.randomInt(Garden.options.petalCount.min, Garden.options.petalCount.max));
	 },
	 createBloom: function (x, y, r, c, pc) {
	 new Bloom(new Vector(x, y), r, c, pc, this);
	 },
	 clear: function () {
	 this.blooms = [];
	 this.ctx.clearRect(0, 0, this.element.width, this.element.height);
	 }
	 }
	 Garden.options = {
	 petalCount: {
	 min: 8,
	 max: 15
	 },
	 petalStretch: {
	 min: 0.1,
	 max: 3
	 },
	 growFactor: {
	 min: 0.1,
	 max: 1
	 },
	 bloomRadius: {
	 min: 8,
	 max: 10
	 },
	 density: 10,
	 growSpeed: 1000 / 60,
	 color: {
				rmin: 128,
				rmax: 255,
				gmin: 0,
				gmax: 128,
				bmin: 0,
				bmax: 128,
	 opacity: 0.1
	 },
	 tanAngle: 60
	 };
	 Garden.random = function (min, max) {
	 return Math.random() * (max - min) + min;
	 };
	 Garden.randomInt = function (min, max) {
	 return Math.floor(Math.random() * (max - min + 1)) + min;
	 };
	 Garden.circle = 2 * Math.PI;
	 Garden.degrad = function (angle) {
	 return Garden.circle / 360 * angle;
	 };
	 Garden.raddeg = function (angle) {
	 return angle / Garden.circle * 360;
	 };
	 Garden.rgba = function (r, g, b, a) {
	 return 'rgba(' + r + ',' + g + ',' + b + ',' + a + ')';
	 };
	 Garden.randomrgba = function (rmin, rmax, gmin, gmax, bmin, bmax, a) {
			var r = Math.round(Garden.random(rmin, rmax));
			var g = Math.round(Garden.random(gmin, gmax));
			var b = Math.round(Garden.random(bmin, bmax));
			var limit = 5;
			if (Math.abs(r - g) <= limit && Math.abs(g - b) <= limit && Math.abs(b - r) <= limit) {
				return Garden.rgba(rmin, rmax, gmin, gmax, bmin, bmax, a);
			} else {
				return Garden.rgba(r, g, b, a);
			}
	 };
</script>
<script language="javascript" type="text/javascript">
var $window = $(window), gardenCtx, gardenCanvas, $garden, garden;
var clientWidth = $(window).width();
var clientHeight = $(window).height();
$(function () {
 // setup garden
	$loveHeart = $("#loveHeart");
	var offsetX = $loveHeart.width() / 2;
	var offsetY = $loveHeart.height() / 2 - 55;
 $garden = $("#garden");
 gardenCanvas = $garden[0];
	gardenCanvas.width = $("#loveHeart").width();
 gardenCanvas.height = $("#loveHeart").height()
 gardenCtx = gardenCanvas.getContext("2d");
 gardenCtx.globalCompositeOperation = "lighter";
 garden = new Garden(gardenCtx, gardenCanvas);
	
	$("#content").css("width", $loveHeart.width() + $("#code").width());
	$("#content").css("height", Math.max($loveHeart.height(), $("#code").height()));
	$("#content").css("margin-top", Math.max(($window.height() - $("#content").height()) / 2, 10));
	$("#content").css("margin-left", Math.max(($window.width() - $("#content").width()) / 2, 10));
 // renderLoop
 setInterval(function () {
 garden.render();
 }, Garden.options.growSpeed);
});
$(window).resize(function() {
 var newWidth = $(window).width();
 var newHeight = $(window).height();
 if (newWidth != clientWidth && newHeight != clientHeight) {
 location.replace(location);
 }
});
function getHeartPoint(angle) {
	var t = angle / Math.PI;
	var x = 19.5 * (16 * Math.pow(Math.sin(t), 3));
	var y = - 20 * (13 * Math.cos(t) - 5 * Math.cos(2 * t) - 2 * Math.cos(3 * t) - Math.cos(4 * t));
	return new Array(offsetX + x, offsetY + y);
}
function startHeartAnimation() {
	var interval = 50;
	var angle = 10;
	var heart = new Array();
	var animationTimer = setInterval(function () {
		var bloom = getHeartPoint(angle);
		var draw = true;
		for (var i = 0; i < heart.length; i++) {
			var p = heart[i];
			var distance = Math.sqrt(Math.pow(p[0] - bloom[0], 2) + Math.pow(p[1] - bloom[1], 2));
			if (distance < Garden.options.bloomRadius.max * 1.3) {
				draw = false;
				break;
			}
		}
		if (draw) {
			heart.push(bloom);
			garden.createRandomBloom(bloom[0], bloom[1]);
		}
		if (angle >= 30) {
			clearInterval(animationTimer);
			showMessages();
		} else {
			angle += 0.2;
		}
	}, interval);
}
(function($) {
	$.fn.typewriter = function() {
		this.each(function() {
			var $ele = $(this), str = $ele.html(), progress = 0;
			$ele.html('');
			var timer = setInterval(function() {
				var current = str.substr(progress, 1);
				if (current == '<') {
					progress = str.indexOf('>', progress) + 1;
				} else {
					progress++;
				}
				$ele.html(str.substring(0, progress) + (progress & 1 ? '_' : ''));
				if (progress >= str.length) {
					clearInterval(timer);
				}
			}, 75);
		});
		return this;
	};
})(jQuery);
function timeElapse(date){
	var current = Date();
	var seconds = (Date.parse(current) - Date.parse(date)) / 1000;
	var days = Math.floor(seconds / (3600 * 24));
	seconds = seconds % (3600 * 24);
	var hours = Math.floor(seconds / 3600);
	if (hours < 10) {
		hours = "0" + hours;
	}
	seconds = seconds % 3600;
	var minutes = Math.floor(seconds / 60);
	if (minutes < 10) {
		minutes = "0" + minutes;
	}
	seconds = seconds % 60;
	if (seconds < 10) {
		seconds = "0" + seconds;
	}
	var result = "<span class=\"digit\">" + days + "</span> days <span class=\"digit\">" + hours + "</span> hours <span class=\"digit\">" + minutes + "</span> minutes <span class=\"digit\">" + seconds + "</span> seconds"; 
	$("#elapseClock").html(result);
}
function showMessages() {
	adjustWordsPosition();
	$('#messages').fadeIn(5000, function() {
		showLoveU();
	});
}
function adjustWordsPosition() {
	$('#words').css("position", "absolute");
	$('#words').css("top", $("#garden").position().top + 195);
	$('#words').css("left", $("#garden").position().left + 70);
}
function adjustCodePosition() {
	$('#code').css("margin-top", ($("#garden").height() - $("#code").height()) / 2);
}
function showLoveU() {
	$('#loveu').fadeIn(3000);
}
</script>
</head>
<body>
<div style="text-align:center;clear:both;">
<script src="/gg_bd_ad_720x90.js" type="text/javascript"></script>
<script src="/follow.js" type="text/javascript"></script>
</div>
<div id="mainDiv">
	<div id="content">
		<div id="code">
			<span class="comments">/**</span><br />
			<span class="space"/><span class="comments">*2009—01-01,</span><br />
			<span class="space"/><span class="comments">*2009-01-01.</span><br />
			<span class="space"/><span class="comments">*/</span><br />
			Boy name = <span class="keyword">Mr</span> A<br />
			Girl name = <span class="keyword">Mrs</span> B<br />
			<span class="comments">// Fall in love river. </span><br />
			The boy love the girl;<br />
			<span class="comments">// They love each other.</span><br />
			The girl loved the boy;<br />
			<span class="comments">// AS time goes on.</span><br />
			The boy can not be separated the girl;<br />
			<span class="comments">// At the same time.</span><br />
			The girl can not be separated the boy;<br />
			<span class="comments">// Both wind and snow all over the sky.</span><br />
			<span class="comments">// Whether on foot or 100 kilometers.</span><br />
			<span class="keyword">The boy</span> very <span class="keyword">happy</span>;<br />
			<span class="keyword">The girl</span> is also very <span class="keyword">happy</span>;<br />
			<span class="placeholder"/><span class="comments">// Whether it is right now</span><br />
			<span class="placeholder"/><span class="comments">// Still in the distant future.</span><br />
			<span class="placeholder"/>The boy has but one dream;<br />
			<span class="comments">// The boy wants the girl could well have been happy.</span><br />
			<br>
			<br>
			I want to say:<br />
			Baby, I love you forever;<br />
		</div>
		<div id="loveHeart">
			<canvas id="garden"></canvas>
			<div id="words">
				<div id="messages">
					亲爱的，这是我们相爱在一起的时光。
					<div id="elapseClock"></div>
				</div>
				<div id="loveu">
					爱你直到永永远远。<br/>
					<div class="signature">- A先生</div>
				</div>
			</div>
		</div>
	</div>
</div>
<script type="text/javascript">
var offsetX = $("#loveHeart").width() / 2;
var offsetY = $("#loveHeart").height() / 2 - 55;
var together = new Date();
together.setFullYear(2009, 01, 01);
together.setHours(20);
together.setMinutes(0);
together.setSeconds(0);
together.setMilliseconds(0);
if (!document.createElement('canvas').getContext) {
	var msg = document.createElement("div");
	msg.id = "errorMsg";
	msg.innerHTML = "Your browser doesn't support HTML5!<br/>Recommend use Chrome 14+/IE 9+/Firefox 7+/Safari 4+"; 
	document.body.appendChild(msg);
	$("#code").css("display", "none")
	$("#copyright").css("position", "absolute");
	$("#copyright").css("bottom", "10px");
	document.execCommand("stop");
} else {
	setTimeout(function () {
		startHeartAnimation();
	}, 5000);
	timeElapse(together);
	setInterval(function () {
		timeElapse(together);
	}, 500);
	adjustCodePosition();
	$("#code").typewriter();
}
</script>
</body>
</html>

相关推荐

为何越来越多的编程语言使用JSON（为什么编程）

JSON是JavascriptObjectNotation的缩写，意思是Javascript对象表示法，是一种易于人类阅读和对编程友好的文本数据传递方法，是JavaScript语言规范定义的一个子...

何时在数据库中使用 JSON（数据库用json格式存储）

在本文中，您将了解何时应考虑将JSON数据类型添加到表中以及何时应避免使用它们。每天?分享?最新?软件?开发?，Devops，敏捷?，测试?以及?项目?管理?最新?，最热门?的?文章?，每天?花?...

MySQL 从零开始:05 数据类型（mysql数据类型有哪些,并举例）

前面的讲解中已经接触到了表的创建，表的创建是对字段的声明，比如：上述语句声明了字段的名称、类型、所占空间、默认值和是否可以为空等信息。其中的int、varchar、char和decimal都...

JSON对象花样进阶（json格式对象）

一、引言在现代Web开发中，JSON（JavaScriptObjectNotation）已经成为数据交换的标准格式。无论是从前端向后端发送数据，还是从后端接收数据，JSON都是不可或缺的一部分。...

深入理解 JSON 和 Form-data（json和formdata提交区别）

在讨论现代网络开发与API设计的语境下，理解客户端和服务器间如何有效且可靠地交换数据变得尤为关键。这里，特别值得关注的是两种主流数据格式：...

JSON 语法（json 语法 priority）

JSON语法是JavaScript语法的子集。JSON语法规则JSON语法是JavaScript对象表示法语法的子集。数据在名称/值对中数据由逗号分隔花括号保存对象方括号保存数组JS...

JSON语法详解（json的语法规则）

JSON语法规则JSON语法是JavaScript对象表示法语法的子集。数据在名称/值对中数据由逗号分隔大括号保存对象中括号保存数组注意：json的key是字符串,且必须是双引号，不能是单引号...

MySQL JSON数据类型操作（mysql的json）

概述mysql自5.7.8版本开始，就支持了json结构的数据存储和查询，这表明了mysql也在不断的学习和增加nosql数据库的有点。但mysql毕竟是关系型数据库，在处理json这种非结构化的数据...

JSON的数据模式（json数据格式示例）

像XML模式一样，JSON数据格式也有Schema，这是一个基于JSON格式的规范。JSON模式也以JSON格式编写。它用于验证JSON数据。JSON模式示例以下代码显示了基本的JSON模式。{"...

前端学习——JSON格式详解（后端json格式）

JSON(JavaScriptObjectNotation)是一种轻量级的数据交换格式。易于人阅读和编写。同时也易于机器解析和生成。它基于JavaScriptProgrammingLa...

什么是 JSON:详解 JSON 及其优势（什么叫json）

现在程序员还有谁不知道JSON吗？无论对于前端还是后端，JSON都是一种常见的数据格式。那么JSON到底是什么呢？JSON的定义...

PostgreSQL JSON 类型:处理结构化数据

PostgreSQL提供JSON类型，以存储结构化数据。JSON是一种开放的数据格式，可用于存储各种类型的值。什么是JSON类型？JSON类型表示JSON(JavaScriptO...

JavaScript:JSON、三种包装类（javascript 包）

JOSN:我们希望可以将一个对象在不同的语言中进行传递，以达到通信的目的，最佳方式就是将一个对象转换为字符串的形式JSON（JavaScriptObjectNotation）-JS的对象表示法...

Python数据分析 只要1分钟 教你玩转JSON 全程干货

Json简介：Json，全名JavaScriptObjectNotation,JSON(JavaScriptObjectNotation(记号、标记))是一种轻量级的数据交换格式。它基于J...

比较一下JSON与XML两种数据格式?（json和xml哪个好）

JSON（JavaScriptObjectNotation）和XML（eXtensibleMarkupLanguage）是在日常开发中比较常用的两种数据格式，它们主要的作用就是用来进行数据的传...

取消回复欢迎 你 发表评论:

请填写验证码
一周热门
最近发表
标签列表