【前端】JavaScript入门及实战101-105

最新推荐文章于 2024-08-26 11:53:53 发布
最新推荐文章于 2024-08-26 11:53:53 发布
阅读量569 收藏 18
点赞数 26
分类专栏： 【前端】JavaScript入门及实战（1-140） 文章标签： 前端 javascript 开发语言
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_45980065/article/details/140656274
版权

文章目录

101 DOM查询的其他方法

<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset="utf-8">	
	<script type="text/javascript">	
		window.onload = function(){
			// 获取body标签
			//var body = document.getElementsByTagName("body")[0];
			
			/*
				在document中有一个属性body，他保存的是body的引用
			*/
			var body = document.body;
			
			/*
				document.documentElement保存的是html根标签
			*/
			var html = document.documentElement;
			
			/*
				document.all保存页面中所有元素
			*/
			var all = document.all;
			all = document.getElementsByTagName("*"); // *：所有元素
			
			/*
				根据元素的class属性值查询一组元素节点对象
				getElementsByClassName()可以根据class属性值获取一组元素节点对象，
				该方法不支持IE8及以下浏览器
			*/
			var box1 = document.getElementsByClassName("box1");
			
			// 获取页面中所有的div
			var divs = document.getElementsByTagName("div");
			
			// 获取class为box1中所有的div
			// .box1 div
			/*
				document.querySelector()
				需要一个选择器的字符串作为参数，可以根据一个CSS选择器来查询一个元素节点对象
				
				虽然IE8中没有document.getElementsByClassName()但是可以使用document.querySelector()代替
				使用该方法总会返回唯一的一个元素，如果满足条件的元素有多个，那么只会返回第一个
			*/
			var div = document.querySelector(".box1 div");
			
			var box1 = document.querySelector(".box1");
			
			/*
				document.querySelectorAll()
				该方法和querySelectorAll()用法类似，不同的是它会将符合条件的元素封装到一个数组中返回
				即使符合条件的只有一个，也会返回数组
			*/
			var box1 = document.querySelectorAll(".box1");
			var box1 = document.querySelectorAll("#box1");
		};				
	</script>	
</head>
<body>
	<div class="box1">
		<div>我是box1中的div</div>
	</div>
	<div class="box1">
		<div>我是box1中的div</div>
	</div>
	<div id="box1">
		<div>我是box1中的div</div>
	</div>	
</body>
</html>

102 DOM增删改

<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset="utf-8">	
	<script type="text/javascript">	
		function myClick(idStr, fun) {
			var btn = document.getElementById(idStr);
			btn.onclick = fun;
		}

		window.onload = function(){		
			// 创建一个“广场”节点，添加到#city下
			myClick("btn01", function(){
				// 创建广州节点<li>广州</li>
				// 创建li元素节点
				/*
					document.createElement()
						可以用于创建一个元素节点对象，
						他需要一个标签名作为参数，将会根据该标签名创建元素节点对象，
						并将创建好的对象作为返回值返回
				*/
				var li = document.createElement("li");
				
				// 创建广州文本节点
				/*
					document.createTextNode()
						可以用来创建一个文本节点对象，
						需要一个文本内容作为参数，将会根据该内容创建文本节点，并将新的节点返回
				*/
				var gzText = document.createTextNode("广州");
				
				// 将gzText设置li的子节点
				/*
					appendChild()
						向一个父节点中添加一个新的子节点
						用法：父节点.appendChild(子节点);
				*/
				li.appendChild(gzText);
				
				// 将广州添加到city下
				// 获取id为city的节点
				var city = document.getElementById("city");
				city.appendChild(li);				
			});
			
			// 将“广州”节点插入到#bj前面
			myClick("btn02", function(){
				// 创建一个广州
				var li = document.createElement("li");
				var gzText = document.createTextNode("广州");
				li.appendChild(gzText);
				
				// 获取id为bj的节点
				var bj = document.getElementById("bj");
				
				// 获取id为city的节点
				var city = document.getElementById("city");
				
				/*
					insertBefore()
						可以在指定的子节点前插入新的子节点
						语法：父节点.insertBefore(新节点，指定节点);
				*/
				city.insertBefore(li, bj);							
			});
			
			// 使用“广州”节点替换#bj节点
			myClick("btn03", function(){
				// 创建一个广州
				var li = document.createElement("li");
				var gzText = document.createTextNode("广州");
				li.appendChild(gzText);
				
				// 获取id为bj的节点
				var bj = document.getElementById("bj");
				
				// 获取id为city的节点
				var city = document.getElementById("city");
				
				/*
					replaceChild()
						可以使用指定的子节点替换已有的子节点
						语法：父节点.replaceChild(新节点，旧节点);
				*/
				city.replaceChild(li, bj);
			});
						
			// 删除#bj节点
			myClick("btn04", function(){
				// 获取id为bj的节点
				var bj = document.getElementById("bj");
				
				// 获取id为city的节点
				var city = document.getElementById("city");
				
				/*
					removeChild()
						可以删除一个子节点
						语法：父节点.removeChild(子节点);
						
					子节点.parentNode.removeChild(子节点);
				*/
				//city.removeChild(bj);
				
				bj.parentNode.removeChild(bj);
			});
			
			// 读取#city内的HTML代码
			myClick("btn05", function(){
				// 获取id为city的节点
				var city = document.getElementById("city");
				
				alert(city.innerHTML);
			});
			
			// 设置#bj内的HTML代码
			myClick("btn06", function(){
				// 获取id为bj的节点
				var bj = document.getElementById("bj");
				bj.innerHTML = "昌平";
			});
			
			myClick("btn07", function(){
				// 向city中添加广州
				var city = document.getElementById("city");
				
				/*
					使用innerHTML也可以完成DOM的增删改相关操作
					一般我们会两种方式结合使用
				*/
				//city.innerHTML += "<li>广州</li>";
				
				// 创建一个li
				var li = document.createElement("li");
				// 向li中设置文本
				li.innerHTML = "广州";
				// 将li添加到city中
				city.appendChild(li);
			});						
		};
	</script>	
</head>
<body>
	<div id="total">
		<div class="inner">
			<p>你喜欢哪个城市</p>
			<ul id="city">
				<li id="bj">北京</li>
				<li>上海</li>
				<li>成都</li>
				<li>深圳</li>
			</ul>
		</div>
	</div>
	<div id="btnList"> 
		<div><button id="btn01">创建一个“广州”节点，添加到#city下</button></div>
		<div><button id="btn02">将“广州”节点插入到#bj前面</button></div>
		<div><button id="btn03">使用“广州”节点替换#bj节点</button></div>
		<div><button id="btn04">删除#bj节点</button></div>
		<div><button id="btn05">读取#city内的HTML代码</button></div>
		<div><button id="btn06">设置#bj内的HTML代码</button></div>
		<div><button id="btn07">创建一个“广州”节点，添加到#city下（innerHTML）</button></div>
	</div>
</body>
</html>

103 添加删除记录-删除

<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset="utf-8">	
	<script type="text/javascript">	
		window.onload = function(){
			/*
				点击超链接以后，删除一个员工的信息			
			*/
			// 获取所有超链接
			var allA = document.getElementsByTagName("a");
			
			// 为每个超链接绑定一个单击响应函数
			for(var i = 0; i < allA.length; i++){
				allA[i].onclick = function(){
					
					// 点击超链接以后需要删除超链接所在行
					// 这里我们点击那个超链接this就是谁
					// 获取当前tr
					var tr = this.parentNode.parentNode;
					
					// 获取要删除员工的名字
					//var name = tr.getElementsByTagName("td")[0].innerHTML;
					var name = tr.children[0].innerHTML;
					
					// 删除之前弹出一个提示框
					/*
						confirm()用于弹出一个带有确认和取消按钮的提示框，
						需要一个字符串作为参数，该字符串将会作为提示文字显示出来，
						如果用户点击确认则会返回true，如果点击取消则返回false
					*/
					var flag = confirm("确认删除" + name + "吗");
					
					// 如果用户点击确认
					if(flag){
						// 删除tr
						tr.parentNode.removeChild(tr);				
					}
					
					/*
						点击超链接以后，超链接会跳转页面，这个是超链接的默认行为，
						但是此时我们不希望出现默认行为，可以通过在响应函数的最后return false来取消默认行为
					*/
					return false					
				};
			}
		};				
	</script>	
</head>
<body>
	<table id="employeeTable">
		<tr>
			<th>Name</th>
			<th>Email</th>
			<th>Salary</th>
			<th>&nbsp;</th>
		</tr>
		<tr>
			<td>Tom</td>
			<td>tom@tom.com</td>
			<td>5000</td>
			<td><a href="javascript:;">Delete</a></td>
		</tr>
		<tr>
			<td>Jerry</td>
			<td>jerry@sohu.com</td>
			<td>8000</td>
			<td><a href="deleteEmp?id=002">Delete</a></td>
		</tr>
		<tr>
			<td>Bob</td>
			<td>bob@tom.com</td>
			<td>10000</td>
			<td><a href="deleteEmp?id=003">Delete</a></td>
		</tr>
	</table>

	<div id="formDiv">
	
		<h4>添加新员工</h4>
		<table>
			<tr>
				<td class="word">name: </td>
				<td class="inp">
					<input type="text" name="empName" id="empName" />
				</td>
			</tr>
			<tr>
				<td class="word">email: </td>
				<td class="inp">
					<input type="text" name="email" id="email" />
				</td>
			</tr>
			<tr>
				<td class="word">salary: </td>
				<td class="inp">
					<input type="text" name="salary" id="salary" />
				</td>
			</tr>
			<tr>
				<td colspan="2" align="center">
					<button id="addEmpButton" value="abc">
						Submit
					</button>
				</td>
			</tr>
		</table>
	</div>
</body>
</html>

104 添加删除记录-添加

<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset="utf-8">	
	<script type="text/javascript">	
		/*
			删除tr的响应函数
		*/
		function delA(){
			// 点击超链接以后需要删除超链接所在行
			// 这里我们点击那个超链接this就是谁
			// 获取当前tr
			var tr = this.parentNode.parentNode;
					
			// 获取要删除员工的名字
			//var name = tr.getElementsByTagName("td")[0].innerHTML;
			var name = tr.children[0].innerHTML;
					
			// 删除之前弹出一个提示框
			/*
				confirm()用于弹出一个带有确认和取消按钮的提示框，
				需要一个字符串作为参数，该字符串将会作为提示文字显示出来，
				如果用户点击确认则会返回true，如果点击取消则返回false
			*/
			var flag = confirm("确认删除" + name + "吗");
					
			// 如果用户点击确认
			if(flag){
				// 删除tr
				tr.parentNode.removeChild(tr);				
			}
					
			/*
				点击超链接以后，超链接会跳转页面，这个是超链接的默认行为，
				但是此时我们不希望出现默认行为，可以通过在响应函数的最后return false来取消默认行为
			*/
			return false					
		}
		
		window.onload = function(){
			/*
				点击超链接以后，删除一个员工的信息			
			*/
			// 获取所有超链接
			var allA = document.getElementsByTagName("a");
			
			// 为每个超链接绑定一个单击响应函数
			for(var i = 0; i < allA.length; i++){
				allA[i].onclick = delA;
			}
			
			/*
				添加员工的功能：点击按钮以后，将员工的信息添加到表格中
			*/
			// 为提交按钮绑定一个单击响应函数
			var addEmpButton = document.getElementById("addEmpButton");
			addEmpButton.onclick = function(){
				// 获取用户添加的员工信息
				// 获取员工的名字
				var name = document.getElementById("empName").value;
				// 获取员工的email和salary
				var email = document.getElementById("email").value;
				var salary = document.getElementById("salary").value;
			
				// 将获取到的信息保存到tr中
				// 创建一个tr
				var tr = document.createElement("tr");
				
				// 创建一个td
				var nameTd = document.createElement("td");
				var emailTd = document.createElement("td");
				var salaryTd = document.createElement("td");
				var aTd = document.createElement("td");
				
				// 创建一个a元素
				var a = document.createElement("a");
				
				// 创建文本节点
				var nameText = document.createTextNode("name");
				var emailText = document.createTextNode("email");
				var salaryText = document.createTextNode("salary");
				var delText = document.createTextNode("Delete");
				
				// 将文本添加到td中
				nameTd.appendChild(nameText);
				emailTd.appendChild(emailText);
				salaryTd.appendChild(salaryText);
				
				// 向a中添加文本
				a.appendChild(delText);
				// 将a添加到td中
				aTd.appendChild(a);
				
				// 将td添加到tr中
				tr.appendChild(nameTd);
				tr.appendChild(emailTd);
				tr.appendChild(salaryTd);
				tr.appendChild(aTd);
				
				// 向a中添加href属性
				a.href = "javascript:;";
				
				// 为新添加的a绑定单击事件
				a.onclick = delA;
				
				// 获取table
				var employeeTable = document.getElementById("employeeTable");
				// 获取employeeTable中的tbody
				/*
					<table>
						<tbody>
							<tr>
								<td></td>
								<td></td>
								<td></td>
							</tr>
							<tr>
								<td></td>
								<td></td>
								<td></td>
							</tr>
						</tbody>
					</table>
				*/
				var tbody = employeeTable.getElementsByTagName("tbody")[0];
				// 将tr添加到table中
				//employeeTable.appendChild(tr);
				// 将tr添加到tbody中
				tbody.appendChild(tr);
			}
		};				
	</script>	
</head>
<body>
	<table id="employeeTable">
		<tr>
			<th>Name</th>
			<th>Email</th>
			<th>Salary</th>
			<th>&nbsp;</th>
		</tr>
		<tr>
			<td>Tom</td>
			<td>tom@tom.com</td>
			<td>5000</td>
			<td><a href="javascript:;">Delete</a></td>
		</tr>
		<tr>
			<td>Jerry</td>
			<td>jerry@sohu.com</td>
			<td>8000</td>
			<td><a href="deleteEmp?id=002">Delete</a></td>
		</tr>
		<tr>
			<td>Bob</td>
			<td>bob@tom.com</td>
			<td>10000</td>
			<td><a href="deleteEmp?id=003">Delete</a></td>
		</tr>
	</table>

	<div id="formDiv">
	
		<h4>添加新员工</h4>

		<table>
			<tr>
				<td class="word">name: </td>
				<td class="inp">
					<input type="text" name="empName" id="empName" />
				</td>
			</tr>
			<tr>
				<td class="word">email: </td>
				<td class="inp">
					<input type="text" name="email" id="email" />
				</td>
			</tr>
			<tr>
				<td class="word">salary: </td>
				<td class="inp">
					<input type="text" name="salary" id="salary" />
				</td>
			</tr>
			<tr>
				<td colspan="2" align="center">
					<button id="addEmpButton" value="abc">
						Submit
					</button>
				</td>
			</tr>
		</table>
	</div>
</body>
</html>

105 添加删除记录-修改

<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset="utf-8">	
	<script type="text/javascript">	
		/*
			删除tr的响应函数
		*/
		function delA(){
			// 点击超链接以后需要删除超链接所在行
			// 这里我们点击那个超链接this就是谁
			// 获取当前tr
			var tr = this.parentNode.parentNode;
					
			// 获取要删除员工的名字
			//var name = tr.getElementsByTagName("td")[0].innerHTML;
			var name = tr.children[0].innerHTML;
					
			// 删除之前弹出一个提示框
			/*
				confirm()用于弹出一个带有确认和取消按钮的提示框，
				需要一个字符串作为参数，该字符串将会作为提示文字显示出来，
				如果用户点击确认则会返回true，如果点击取消则返回false
			*/
			var flag = confirm("确认删除" + name + "吗");
					
			// 如果用户点击确认
			if(flag){
				// 删除tr
				tr.parentNode.removeChild(tr);				
			}
					
			/*
				点击超链接以后，超链接会跳转页面，这个是超链接的默认行为，
				但是此时我们不希望出现默认行为，可以通过在响应函数的最后return false来取消默认行为
			*/
			return false					
		}
		
		window.onload = function(){
			/*
				点击超链接以后，删除一个员工的信息			
			*/
			// 获取所有超链接
			var allA = document.getElementsByTagName("a");
			
			// 为每个超链接绑定一个单击响应函数
			for(var i = 0; i < allA.length; i++){
				allA[i].onclick = delA;
			}
			
			/*
				添加员工的功能：点击按钮以后，将员工的信息添加到表格中
			*/
			// 为提交按钮绑定一个单击响应函数
			var addEmpButton = document.getElementById("addEmpButton");
			addEmpButton.onclick = function(){
				// 获取用户添加的员工信息
				// 获取员工的名字
				var name = document.getElementById("empName").value;
				// 获取员工的email和salary
				var email = document.getElementById("email").value;
				var salary = document.getElementById("salary").value;
			
				// 将获取到的信息保存到tr中
				// 创建一个tr
				var tr = document.createElement("tr");
				
				// 设置tr中的内容
				tr.innerHTML = "<td>" + name + "</td>" +  
							   "<td>" + email + "</td>" + 
							   "<td>" + salary + "</td>" + 
							   "<td><a href='javascript:;'>Delete</a></td>";
				
				// 获取刚刚添加的a元素，并绑定单击响应函数
				var a = tr.getElementsByTagName("a")[0];
				a.onclick = delA;
								
				// 获取table
				var employeeTable = document.getElementById("employeeTable");
				// 获取employeeTable中的tbody
				/*
					<table>
						<tbody>
							<tr>
								<td></td>
								<td></td>
								<td></td>
							</tr>
							<tr>
								<td></td>
								<td></td>
								<td></td>
							</tr>
						</tbody>
					</table>
				*/
				var tbody = employeeTable.getElementsByTagName("tbody")[0];
				// 将tr添加到table中
				//employeeTable.appendChild(tr);
				// 将tr添加到tbody中
				tbody.appendChild(tr);
				/*
					tbody.innerHTML += "<td>" + name + "</td>" +  
									   "<td>" + email + "</td>" + 
									   "<td>" + salary + "</td>" + 
									   "<td><a href='javascript:;'>Delete</a></td>";
				*/
			}
		};				
	</script>	
</head>
<body>
	<table id="employeeTable">
		<tr>
			<th>Name</th>
			<th>Email</th>
			<th>Salary</th>
			<th>&nbsp;</th>
		</tr>
		<tr>
			<td>Tom</td>
			<td>tom@tom.com</td>
			<td>5000</td>
			<td><a href="javascript:;">Delete</a></td>
		</tr>
		<tr>
			<td>Jerry</td>
			<td>jerry@sohu.com</td>
			<td>8000</td>
			<td><a href="deleteEmp?id=002">Delete</a></td>
		</tr>
		<tr>
			<td>Bob</td>
			<td>bob@tom.com</td>
			<td>10000</td>
			<td><a href="deleteEmp?id=003">Delete</a></td>
		</tr>
	</table>

	<div id="formDiv">
	
		<h4>添加新员工</h4>

		<table>
			<tr>
				<td class="word">name: </td>
				<td class="inp">
					<input type="text" name="empName" id="empName" />
				</td>
			</tr>
			<tr>
				<td class="word">email: </td>
				<td class="inp">
					<input type="text" name="email" id="email" />
				</td>
			</tr>
			<tr>
				<td class="word">salary: </td>
				<td class="inp">
					<input type="text" name="salary" id="salary" />
				</td>
			</tr>
			<tr>
				<td colspan="2" align="center">
					<button id="addEmpButton" value="abc">
						Submit
					</button>
				</td>
			</tr>
		</table>
	</div>
</body>
</html>
子非鱼921
关注
  • 26
    点赞
  • 踩
  • 18
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
黑夜力作-Web爬虫入门与实战精讲-专栏导读
黑夜开发者的博客
08-21 1352
本专栏本着从零到一，全面覆盖，实战为王，学以致用。本专栏从爬虫的基本概念讲起，逐步深入到HTTP协议、请求与响应、XPath等，再到Selenium、BeautifulSoup等主流爬虫框架的应用，最后手把手开发出电商订单抓取实战项目，让你轻松掌握Web爬虫的奥秘，下面是专栏主要的一些内容展示，欢迎大家订阅，分享，探讨。
B站---【狂神说Java】JavaWeb入门到实战---笔记
热门推荐
bell_love的博客
04-23 18万+
JavaWebJava Web 1、基本概念web开发： ·web，网页的意思，www.baidu.com· 静态web 。html,sss 。提供给所有人看的数据始终不会发生变化！ 动态web 。淘宝，几乎是所有的网站； 。提供给所有人看的数据始终会发生变化，每个人在不同的时间，不同的地点看到的信息各不相同！ 。技术栈：Servlet/ISP，ASP，PHP ...
web前端入门到实战：JavaScript-确认（confirm 消息对话框）
前端工程师年薪30万，就靠这套教程！持续更新最新知识
04-15 1311
confirm 消息对话框通常用于允许用户做选择的动作，如：“你对吗？”等。弹出对话框(包括一个确定按钮和一个取消按钮)。 1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <title>JavaScript-确认...
web前端入门到实战：JavaScript-警告（alert 消息对话框）
前端工程师年薪30万，就靠这套教程！持续更新最新知识
04-15 1512
1 alert(字符串或变量); 我们在访问网站的时候，有时会突然弹出一个小窗口，上面写着一段提示信息文字。如果你不点击“确定”，就不能对网页做任何操作，这个小窗口就是使用alert实现的，以上为alert()语法 1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset...
web前端设计从入门到实战
qq_53886372的博客
03-14 522
世界地球日实验2
Vue.js 快速入门实战
努力是为了站在万人之中，成为别人的光
06-12 2万+
通过这个简单的待办事项列表应用，我们学习了 Vue.js 的基本用法，包括数据绑定、事件处理和列表渲染。Vue.js 的设计使得它非常易于上手，并且能够与其他库或已有项目无缝整合。希望这篇文章能帮助你快速入门 Vue.js，并为你的前端开发之旅打下坚实的基础。接下来，你可以继续学习 Vue 的其他特性，例如组件、路由和状态管理等，以便在更复杂的项目中更好地使用 Vue.js。祝你学习愉快！
web前端入门到实战：JavaScript-提问（prompt 消息对话框）
前端工程师年薪30万，就靠这套教程！持续更新最新知识
04-15 959
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <title> JavaScript-提问（prompt 消息对话框）</title> 6 <script type="text...
前端JavaScript入门到精通，javascript核心进阶ES6语法、API、js高级等基础知识和实战 —— JS基础（一）
upgrade_bro的博客
09-15 695
前端JavaScript入门到精通，javascript核心进阶ES6语法、API、js高级等基础知识和实战 —— JS基础（一）——JavaScript介绍、变量、数据类型、类型转换
① - 前端三剑客之基础入门篇 - 千字文认知前端开发
易编橙 · 终身成长社群，相遇已是上上签！
02-27 2万+
什么是前端？前端的发展历程？前端要学什么知识？一千字带你认识什么是前端开发。
HTML+ CSS+JavaScript实战 ----仿慕课网【简单易上手】
a23452的博客
12-07 3974
Java学习打卡：第89天 javaWeb 内容导航Web项目[仿慕课网项目]界面展示界面布局HTML代码部分展示CSS代码部分展示JS代码部分展示HTML补充URL,HTTP,HTML介绍特殊的注释【条件注释】HTML头部元素CSS和HTML属性的区别div嵌套展示< ol>标签的type通过CSS设置列表符号制作导航栏使用div和span布局表单HTML5audio音频video视频新的按钮input Java养成计划（打卡第85天) Web 项目 HTML+CSS + JavaScri
JavaWeb 入门级项目实战 -- 文章发布系统
04-28
在本JavaWeb入门级项目实战中，我们将深入探讨如何构建一个文章发布系统。这个系统将包含用户注册、登录、发布文章、浏览文章以及评论互动等功能，是初学者掌握JavaWeb开发技术的理想实践平台。我们将主要涉及到以下...
react入门实战项目-类印象笔记应用源码
08-11
本篇，将记录如何使用React实现一个简版的印象笔记App的入门实例，本实例也比较好实现，但内容相对于上个Demo更加丰富，用到了许多新的知识点，都是非常实用，必须掌握的一些内容,本菜鸟自己实践了一遍，收益非常多...
零基础5分钟上手亚马逊云科技-云原生架构设计
m0_66628975的博客
08-26 1368
欢迎来到小李哥全新亚马逊云科技AWS云计算知识学习系列，适用于任何无云计算或者亚马逊云科技技术背景的开发者，通过这篇文章大家零基础5分钟就能完全学会亚马逊云科技一个经典的服务开发架构方案。我会每天介绍一个基于亚马逊云科技AWS云计算平台的全球前沿云开发/架构技术解决方案，帮助大家快速了解国际上最热门的云计算平台亚马逊云科技AWS最佳实践，并应用到自己的日常工作里。
前端开发攻略---在Vue3项目中修改Element-Plus主题色
nibabaoo的博客
08-22 246
在Vue3项目中修改Element-Plus主题色
vue中定义一个url文件,在vue文件中引入
weixin_65767506的博客
08-22 328
1.在src/utils文件夹下创建一个url.js。3.在其他vue文件中引入。2.url.js的内容为。4.在挂载时打印一下。打印出来就可以用了.
前端宝典十六：深入浅出8大设计模式
franktaoge的博客
08-24 1071
本文主要探讨前端开发中的各种设计模式，主要分类有： - 单例模式 - 建造者模式 - 代理模式 - 装饰器模式 - 适配器模式 - 策略模式 - 观察者模式 - 发布订阅模式 通过对他们实际开发中的使用场景的解析，深入浅出的一起更全面直观的进行学习：
前端审查_Nginx
阿宝的博客
08-22 357
vueCli/vite/cra/umi等都是运行 build脚本build如何定义 打包生产环境代码配置在配置文件 vue.config.js中。
基于Thymeleaf、bootstrap、layUI 混合前端应用
最新发布
宣晨光
08-26 564
以下代码基于Spring boot + Thymeleaf框架，前端采用BootstrapV3.3.7 LayUIV2.9.13 版本。
前端：篮球投掷动画
懒羊羊大王的博客
08-23 951
使用 H5 和 CSS3 实现的一个篮球投掷动画。 玩法：通过点击篮球所在的绿色(紫色)容器，实现篮球的投掷和回收。
前端开发入门指南：JavaScript实战与进阶
首先，书名提到的"Getting Started with JavaScript"（JavaScript入门）是第一章，它为初学者提供了一个友好的起点，介绍了JavaScript的基本概念和语法，使读者能够快速建立起对这门语言的认识。这一章可能会包括...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

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

余额充值