前端

HTML

• Html 标签库（积木，界面难看）

1. 伪XML规范
   1. 只有一个根节点
   2. 每个节点（多个子节点，多个属性，内容）
   3. 每个节点（开节点，闭节点）
2. 标签框架（html，head，body）
   1. 按html5标准
   2. head：非显示，设置行标签
   3. body：文档的显示内容
3. 标签类型：

   1. 基本标签
      1. 百度
      href：目标地址；target：页面显示位置
      2.
      img可导致图片拉伸，不适合做背景

   2. 面板标签
      1.

      （块元素）
      2. （行内元素）

   3. 数据标签（表单标签）

      • 1. Action 数据提交地址
        2. Method 请求的类型 get、post
           a) Get 信息在地址栏上
           b) Post 信息在协议体上
      • 1. Type 控件类型
        2. Value 参数值
      • 下拉列表
        多行文本
        表格数据展示

        定位标签

        1. 内容

           段落
        2. 
下一行
        3.   空格

        效果标签

        1. 粗体

        2. ……

           标题

        列表标签

        1. 有序列表
        2. 无序列表

        CSS

        • 层叠样式表
          color: red;background-color: green;

          1. 属性：样式；

          2. 颜色的设置：
             color: red;
             color: #f00/#ff0000;（RGB颜色值）
             color:rgba(255,0,0,0.5);（a：透明度）
             优先级：
             选择范围（范围越大，优先级越小）
             加载顺序（后加载的优先）
             特定优先级（！important）

          3. 用法

             1. 行内使用（当前标签生效，优先级高，特例使用）
                合法化

             2. 页内使用

             3. 页外使用（选择器写入文件，支持浏览器缓存）
                

          4. 选择器（选择样式实施的标签）

             • a{ }标签选择器

             • #a{ }id选择器 id属性值（页面内唯一）

             • .aa{ }类选择器 class属性值 （可设置多个）
               111

             • [aaa=‘a1’]属性选择器（如果属性值为数值或中文时，必须加单引号）

                222
               [aaa=a1]{
               					color:green;
               				}
               

             • a，div{ }或选择器 a和div都有效

             • Div a{ } 归属选择器 （div标签内的全部a标签）

             • Div>a{ }子孙选择器 （div标签内的直接子a标签）

             • ：hover 伪类（标签状态选择器）

          5. box模型+定位

             • margin：外边距（微调位置，占用原位置）
             • border：边框（设置：颜色，样式，粗细）
             • padding：内边距（内容位置改变，可能导致大小改变）
             • position+left+right+bottom+top 定位
               • position：fixed 超级绝对定位（忽略级层，按文档左上角定位，独立一层）
               • position：absolute 绝对定位（最常用的定位，按照上级容器的左上角定位，上级容器也为绝对定位）
                 iii. position：relative 相对定位（按原位置来进行定位）

          6. 常用属性

             • Display 显示模式（none，block，inline）
             • visibility：hidden 看不见隐藏
             • float：对齐定位
             • cursor：游标
             • outline：none；隐藏录入焦点边框
             • z-index：设置标签重叠样式的优先级
             • overflow：超出范围解决方法

          7. 简单的css3

             • css3效果生成器 生成器

          8. 额外框架及使用

             • Animate.css
             • Buttons.css

        JavaScript

        • 不是java，做页面交互（动画，事件）

        用法

        • 事件，行内用法

          <a href="#" onclick="alert(11)">lhya>
          

        • 页内

          	<script>
          		function ok(){
          				alert(11)
          		}
          		script>
          

        • 页外

          <script type="text/javascript" src="js/my.js" >script>
          

        语法（弱类型）

        			var a = 100;/*变量定义*/
        			var b = "qwe";	//随时更换变量
        			c = "123";	//var 可省略
        			d = {1,2,3,4};/*数组定义*/
        			e = {name:"123",sex:2};/*对象定义*/
        			alert(e.name);	//对象属性
        			function add(a,b){/*函数定义，不指定返回值，参数不指定类型*/
        				return a+b;
        			}
        			function add(a,b，c){
        				if(!b)b=100;	//判断null，undefined，false
        				return c(a,b);
        			}
        			var fun = function(a,b,c);	//变量值为函数
        			fun(11,22,function(c,d){	//匿名函数
        				alert(c+d);
        			})
        

        null（空），NaN（计算失败），undefined（非法运算，未定义）

        BOM

        • Browser Object Model（浏览器对象模板）
        • navigator：浏览器基本信息（浏览器兼容）
        • navigator.product
        • Screen：用户屏幕信息
          • screen.deviceXDPI
        • History：浏览器历史
          • history.back()：等同于在浏览器点击后退按钮
          • history.forward()：等同于在浏览器点击前进按钮
          • history.length；浏览器历史
        • Location：获取当前页面地址（URL），并把浏览器重定向到新页面
          • location.reload：刷新
          • locating.href：转到目标地址
        • window：所有BOM对象的上级

          • 窗口方法：

            window.open(“http://www.baidu.com”,"_self");
            window.open(“index.html”,"_new",“width:100px;height:100px”);
            this.resizeTo(300,500);
            this.close();
            window.moveTo();
            window.scrollBy();

          • 对话框方法

            		alert()	；//消息对话框 
            		if(confirm("yes/no"))	//选择对话框
            			alert("yes");
            			var str = prompt("input");	//录入对话框
            			alert(str);
            
            

          • 计时器

            	 var pos;
            			function ok(){
            				pos = setTimeout(function(){
            					alert("ok");
            				},3000)
            			}
            			function size(){
            				clearTimeout(pos);
            			}
            

        DOM

        document object model：文档对象模板（每个标签就是对象）

        • 获取对象

          1. 标签id属性为变量名

             mydiv.innerHTML = " ";

          2. 使用getElementById

             var d = document.getElementById(“my”);
             d.innerHTML = “111”;

          3. 使用

             var d = document.getElementsByTagName();
             d[0].innerHTML = “111”;

          4. 使用

             var d = document.getElementsByClassName();
             d[0].innerHTML = “111”;

        • 修改对象

          1. value 值/input
          2. name
          3. innerHTML
          4. style
          5. class classList

             d[1].style.color="#0f0"; //操控css
             var left = d[1].offsetLeft；//只读

        • 创建删除

          1. 追加标签

             • 第一种

               var d = document.getElementsByTagName(“div”);
               var a = document.createElement(“a”);
               a.href = “#”;
               a.innerText = “我的”;
               d[0].appendChild(a);

             • 第二种

               var d = document.getElementsByTagName(“div”);
               d[0].innerHTML = “qwe”;

          2. 删除标签

             var d = document.getElementsByTagName(“a”);
             d[1].parentElement.removeChild(d[1]);

          3. 事件：（冒泡事件：点击子标签，父级标签联动响应）

             • onclick = “ok”； //标签加入事件
             • window.onload = function() //js脚本加入事件
             • event 对象， 事件对象（公共事件）
             • this对象，事件源自身

        面向对象

        var user={name:"lhy",sex:1,mov:function(x,y){
        				alert(x+y);
        			},sub:[2,12,"233"]};			//prop
        			alert(user.name);
        			user.mov(10,11);
        			alert(user.sub[2]);
        

        function user(name){			//类，构造方法
        				this.name = name;		//实例变量
        				this.mov = function(){	//实例方法
        					add();
        				}
        				function add(){			//私有方法
        					alert(sex);
        				}
        				var sex = 0;			//私有变量
        			}
        			
        			var u = new user("lhy");
        			u.mov();
        

        • 继承

        1. 原型继承

        			function user(){
        			}
        			user.prototype.age=100;
        			var u = new user();
        			alert(u.age);
        

        2. call继承

        function user(){
        				this.age=21;
        			}
        			function myuser(){
        				user.call(this);
        				this.name="lhy";
        			}
        			
        			var u = new myuser();
        			alert(u.name)
        			alert(u.age);
        

        Cavas：绘制图片

        调试

        • console.log()，相当于syso输出

        ajax

        • Asynchronous Javascript And XML（异步 JavaScript 和 XML 或者是 HTML）
        • 发出异步请求（web服务器），非刷新请求
        • 步骤：
          1. var hr = new XMLHttpRequest(); //创建
          2. hr.open(“GET”,“js/a.json”); //设置
          3. hr.send(); //发送，可带参数发送
          4. hr.onreadystatechange； //状态改变

        			function sendmsg(){
        				var hr = new XMLHttpRequest();	//创建
        				hr.open("GET","js/a.json");	//设置
        				hr.send();	//发送，可带参数发送
        				hr.onreadystatechange=function(){
        					if(hr.readyState==4){			//判断状态
        						var str = hr.responseText;		//回应内容
        						var obj = eval("("+str+")");//json对象转换为prop
        						mya.innerText = obj.name;
        					}
        				}
        				console.log()
        			}
        

        • 异步请求处理：
          1. 先定义onreadystatechange再发送
        • json：
          1. 与prop对象一致，不能加方法
          2. 键值必须加“”，值，数字，Boolean可以不加“”；
          3. 字符：{ }-对象；[ ]-数组；键：值；键：值；数组和对象可无限嵌套

        Bootstrap（css框架）

        • cdn服务器：内容分发网络
        • css定制样式（控件，标签）
        • css栅格（动态布局）

         <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
        

        • 根容器：
          1. .container（固定宽度）
          2. .container-fluid（100%宽度）
        • 创建行，操作列（列不需要创建，12列）

        <div class="row">       //每行
        	<div class="col-md-6 col-sm-10" 
        		style="height: 100px;background: #f0f;">div>
        	<div class="col-md-6 col-sm-2" 
        		style="height: 100px;background: #f00;">div>
        	div>	
        
        

        摆放不开（12个列超出）自动换行

        1. .clearfix：列可能会出现比别的列高，列高对齐
        2. con-mod-4：将列向右侧偏移
        3. col-md-push-3：列排序
        4. .hidden-xs：隐藏
        5. .visible-xs：显示

        • js工具（控件控制）
          1. jQuery 强依赖

        jQuery（js工具库）

        <script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js">script>
        

        选择器

        • $(" 标签/.class/#id")

        与css选择器一致

        $(“a”)

        获取选择的数量

        $(“a”).length

        转换jQuery到js标签对象：$(js标签对象)[index]
        1. 索引转换
        2. jQuery自带get(index)转换

        var HtmlElement=$(“div”)[0];

        转换js对象到jQuery：$()括起来就是jQuery对象

        var a = document.getElementById(“aaa”)
        var aa = $(“a”)
        alert(aa.length)

        方法连用

        var aa = $("a").add($(“div”)).add($(“span”))

        选择器容器添加，定义变量时加入，否则加入失败

        var aa = $("a").add($(“div”))

        遍历

        var aa = $("a").add($(“div”))
        aa.each(function(i,o){ // i索引，o每个js对象
        alert(o)
        })

        检索

        1. 上级
           parent：一级上级
           parents：selector 沿上级查询，找到符合条件

           $(o).parents(“span”).attr(“aaa”)

        2. 兄弟
           prev：前一个
           prevAll：前所有
           next：后一个
           nextAll：后所有
           siblings：查询符合条件的所有兄弟

        3. 下级
           children(expr)：一层子元素，直接的孩子节点
           find(expr)：选择器子孙全部查找
           contents()：查找下面的所有内容，包括节点和文本

        dom操作

        1. text()：（无参）获取+（有参）设置文本；

        2. html( html脚本 )：无参）获取+（有参）设置内容（包括文本，标签）；

        3. attr( 属性名，值 )：（一个参数）获取属性+（两个参数）设置属性值

        4. prop（属性名，值）：同attr；

        5. val（值）：（无参数）获取+（有参）设置value属性

        6. css（prop对象）：

           $(o).css({color:“red”,background:“green”})

           如果有减号属性：
           1. “background-color”，加上引号
           2. backgroundColor，减号后面首字母大写

        7. css（属性名，值）：（一个参数）获取属性+（两个参数）设置属性值

           $(o).css(“color”,“red”)

        8. 增删

           1. 增：

              	$(".aaa").html("">lhy")
              

               	var a = $("").attr("href","#").text("说分就分");
              				$(".aaa").append(a)
              

           2. 删：

              $(".aaa").remove()	//删除自身
              

              $(".aaa").empty()	//清空自身内容
              

        9. 加载完成

           $(function(){
           //window.onload，提前加载
           })

        10. 事件：

            • 终止冒泡

              event.cancelBubble = true;

            $(function(){
            				//$(".classname")
            				$(document).bind("click",".aaa",function(){
            					event.cancelBubble = true;	//组合$("属性值")使用，解决冒泡问题
            					alert(1)
            				})
            			})
            

        11. bind方法：绑定事件（）

        动画

        1. 隐藏和显示 HTML 元素

           hide() 和 show()

        2. 淡入淡出效果

           fadeIn() fadeOut() fadeToggle() fadeTo()

        3. 滑动效果

           slideDown() slideUp() slideToggle()

              $(".bbb").hide(5000,function(){    //动画时间，回调方法
                   		alert(1);
                   	});
           
           

        4. 自定义动画： animate()

           $(".bbb").animate({width:“50px”,height:“50px”},2000);

        Ajax

        $.post(“a.json”,{},function(json){
        },“json”);

        	$.ajax({
        			type: 'post',
        			url: 'a.da',
        			dataType: 'json',   返回对象类型
        			async:true,
        		contentType:"application/x-www-form-urlencoded"
        			'application/json'	   后台处理json
        			'multipart/form-data'  文件
        			data:{}   请求参数
        			success:function(JSON){
        				//结果处理
        			}
        
        

        你可能感兴趣的:(前端)

        • Long类型前后端数据不一致 igotyback 前端
          响应给前端的数据浏览器控制台中response中看到的Long类型的数据是正常的到前端数据不一致前后端数据类型不匹配是一个常见问题，尤其是当后端使用Java的Long类型（64位）与前端JavaScript的Number类型（最大安全整数为2^53-1，即16位）进行数据交互时，很容易出现精度丢失的问题。这是因为JavaScript中的Number类型无法安全地表示超过16位的整数。为了解决这个问
        • DIV+CSS+JavaScript技术制作网页（旅游主题网页设计与制作）云南大理 STU学生网页设计 网页设计期末网页作业html静态网页html5期末大作业网页设计web大作业
          ️精彩专栏推荐作者主页:【进入主页—获取更多源码】web前端期末大作业：【HTML5网页期末作业(1000套)】程序员有趣的告白方式：【HTML七夕情人节表白网页制作(110套)】文章目录二、网站介绍三、网站效果▶️1.视频演示2.图片演示四、网站代码HTML结构代码CSS样式代码五、更多源码二、网站介绍网站布局方面：计划采用目前主流的、能兼容各大主流浏览器、显示效果稳定的浮动网页布局结构。网站程
        • 【加密社】Solidity 中的事件机制及其应用 加密社 闲侃区块链智能合约区块链
          加密社引言在Solidity合约开发过程中，事件（Events）是一种非常重要的机制。它们不仅能够让开发者记录智能合约的重要状态变更，还能够让外部系统（如前端应用）监听这些状态的变化。本文将详细介绍Solidity中的事件机制以及如何利用不同的手段来触发、监听和获取这些事件。事件存储的地方当我们在Solidity合约中使用emit关键字触发事件时，该事件会被记录在区块链的交易收据中。具体而言，事件
        • 关于城市旅游的HTML网页设计——(旅游风景云南 5页)HTML+CSS+JavaScript 二挡起步 web前端期末大作业javascripthtmlcss旅游风景
          ⛵源码获取文末联系✈Web前端开发技术描述网页设计题材，DIV+CSS布局制作,HTML+CSS网页设计期末课程大作业|游景点介绍|旅游风景区|家乡介绍|等网站的设计与制作|HTML期末大学生网页设计作业，Web大学生网页HTML：结构CSS：样式在操作方面上运用了html5和css3，采用了div+css结构、表单、超链接、浮动、绝对定位、相对定位、字体样式、引用视频等基础知识JavaScrip
        • HTML网页设计制作大作业（div+css） 云南我的家乡旅游景点 带文字滚动 二挡起步 web前端期末大作业web设计网页规划与设计htmlcssjavascriptdreamweaver前端
          Web前端开发技术描述网页设计题材，DIV+CSS布局制作,HTML+CSS网页设计期末课程大作业游景点介绍|旅游风景区|家乡介绍|等网站的设计与制作HTML期末大学生网页设计作业HTML：结构CSS：样式在操作方面上运用了html5和css3，采用了div+css结构、表单、超链接、浮动、绝对定位、相对定位、字体样式、引用视频等基础知识JavaScript：做与用户的交互行为文章目录前端学习路线
        • springboot+vue项目实战一-创建SpringBoot简单项目 苹果酱0567 面试题汇总与解析springboot后端java中间件开发语言
          这段时间抽空给女朋友搭建一个个人博客，想着记录一下建站的过程，就当做笔记吧。虽然复制zjblog只要一个小时就可以搞定一个网站，或者用cms系统，三四个小时就可以做出一个前后台都有的网站，而且想做成啥样也都行。但是就是要从新做，自己做的意义不一样，更何况，俺就是专门干这个的，嘿嘿嘿要做一个网站，而且从零开始，首先呢就是技术选型了，经过一番思量决定选择-SpringBoot做后端，前端使用Vue做一
        • 博客网站制作教程 2401_85194651 javamaven
          首先就是技术框架：后端：Java+SpringBoot数据库：MySQL前端：Vue.js数据库连接：JPA(JavaPersistenceAPI)1.项目结构blog-app/├──backend/│├──src/main/java/com/example/blogapp/││├──BlogApplication.java││├──config/│││└──DatabaseConfig.java
        • 最简单将静态网页挂载到服务器上(不用nginx) 全能全知者 服务器nginx运维前端html笔记
          最简单将静态网页挂载到服务器上(不用nginx)如果随便弄个静态网页挂在服务器都要用nignx就太麻烦了，所以直接使用Apache来搭建一些简单前端静态网页会相对方便很多检查Web服务器服务状态：sudosystemctlstatushttpd#ApacheWeb服务器如果发现没有安装web服务器：安装Apache：sudoyuminstallhttpd启动Apache：sudosystemctl
        • 补充元象二面 Redstone Monstrosity 前端面试
          1.请尽可能详细地说明，防抖和节流的区别，应用场景？你的回答中不要写出示例代码。防抖（Debounce）和节流（Throttle）是两种常用的前端性能优化技术，它们的主要区别在于如何处理高频事件的触发。以下是防抖和节流的区别和应用场景的详细说明：防抖和节流的定义防抖：在一段时间内，多次执行变为只执行最后一次。防抖的原理是，当事件被触发后，设置一个延迟定时器。如果在这个延迟时间内事件再次被触发，则重
        • 微信小程序开发注意事项 jun778895 微信小程序小程序
          微信小程序开发是一个融合了前端开发、用户体验设计、后端服务（可选）以及微信小程序平台特性的综合性项目。这里，我将详细介绍一个典型的小程序开发项目的全过程，包括项目规划、设计、开发、测试及部署上线等各个环节，并尽量使内容达到或超过2000字的要求。一、项目规划1.1项目背景与目标假设我们要开发一个名为“智慧校园助手”的微信小程序，旨在为学生提供一站式校园生活服务，包括课程表查询、图书馆座位预约、食堂
        • 字节二面 Redstone Monstrosity 前端面试
          1.假设你是正在面试前端开发工程师的候选人，面试官让你详细说出你上一段实习过程的收获和感悟。在上一段实习过程中，我获得了宝贵的实践经验和深刻的行业洞察，以下是我的主要收获和感悟：一、专业技能提升框架应用熟练度：通过实际项目，我深入掌握了React、Vue等前端框架的使用，不仅提升了编码效率，还学会了如何根据项目需求选择合适的框架。问题解决能力：在实习期间，我遇到了许多预料之外的技术难题。通过查阅文
        • 前端代码上传文件 余生逆风飞翔 前端javascript开发语言
          点击上传文件import{ElNotification}from'element-plus'import{API_CONFIG}from'../config/index.js'import{UploadFilled}from'@element-plus/icons-vue'import{reactive}from'vue'import{BASE_URL}from'../config/index'i
        • uniapp实现动态标记效果详细步骤【前端开发】 2401_85123349 uni-app
          第二个点在于实现将已经被用户标记的内容在下一次获取后刷新它的状态为已标记。这是什么意思呢？比如说上面gif图中的这些人物对象，有一些已被该用户添加为关心，那么当用户下一次进入该页面时，这些已经被添加关心的对象需要以“红心”状态显现出来。这个点的难度还不算大，只需要在每一次获取后端的内容后对标记对象进行状态更新即可。II.动态标记效果实现思路和步骤首先，整体的思路是利用动态类名对不同的元素进行选择。
        • 360前端星计划-动画可以这么玩 马小蜗
          动画的基本原理定时器改变对象的属性根据新的属性重新渲染动画functionupdate(context){//更新属性}constticker=newTicker();ticker.tick(update,context);动画的种类1、JavaScript动画操作DOMCanvas2、CSS动画transitionanimation3、SVG动画SMILJS动画的优缺点优点：灵活度、可控性、性能
        • Vue + Express实现一个表单提交 九旬大爷的梦
          最近在折腾一个cms系统，用的vue+express，但是就一个表单提交就弄了好久，记录一下。环境：Node10+前端：Vue服务端：Express依赖包：vueexpressaxiosexpress-formidableelement-ui（可选）前言：axiosget请求参数是：paramsaxiospost请求参数是：dataexpressget接受参数是req.queryexpresspo
        • 前端知识点 ZhangTao_zata 前端javascriptcss
          下面是一个最基本的html代码body{font-family:Arial,sans-serif;margin:20px;}//JavaScriptfunctionthatdisplaysanalertwhencalledfunctionshowMessage(){alert("Hello!Youclickedthebutton.");}MyFirstHTMLPageWelcometoMyPage
        • 第三十一节:Vue路由:前端路由vs后端路由的了解 曹老师
          1.认识前端路由和后端路由前端路由相对于后端路由而言的,在理解前端路由之前先对于路由有一个基本的了解路由:简而言之,就是把信息从原地址传输到目的地的活动对于我们来说路由就是:根据不同的url地址展示不同的页面内容1.1后端路由以前咱们接触比较多的后端路由,当改变url地址时,浏览器会向服务器发送请求,服务器根据这个url,返回不同的资源内容后端路由的特点就是前端每次跳转到不同url地址,都会重新访
        • 华雁智科前端面试题 因为奋斗超太帅啦 前端笔试面试问题整理javascript开发语言ecmascript
          1.var变量的提升题目：vara=1functionfun(){console.log(b)varb=2}fun()console.log(a)正确输出结果：undefined、1答错了，给一个大嘴巴子，错误答案输出结果为：2,1此题主要考察var定义的变量，作用域提升的问题，相当于varaa=1functionfun(){varbconsole.log(b)b=2}fun()console.l
        • 如何建设数据中台（五）——数据汇集—打破企业数据孤岛 weixin_47088026 学习记录和总结中台数据中台程序人生经验分享
          数据汇集——打破企业数据孤岛要构建企业级数据中台，第一步就是将企业内部各个业务系统的数据实现互通互联，打破数据孤岛，主要通过数据汇聚和交换来实现。企业采集的数据可以是线上采集、线下数据采集、互联网数据采集、内部数据采集等。线上数据采集主要载体分为互联网和移动互联网两种，对应有系统平台、网页、H5、小程序、App等，可以采用前端或后端埋点方式采集数据。线下数据采集主要是通过硬件来采集，例如：WiFi
        • 分布式锁和spring事务管理 暴躁的鱼 锁及事务分布式springjava
          最近开发一个小程序遇到一个需求需要实现分布式事务管理业务需求用户在使用小程序的过程中可以查看景点，对景点地区或者城市标记是否想去，那么需要统计一个地点被标记的人数，以及记录某个用户对某个地点是否标记为想去，用两个表存储数据，一个地点表记录改地点被标记的次数，一个用户意向表记录某个用户对某个地点是否标记为想去。由于可能有多个用户同时标记一个地点，每个用户在前端点击想去按钮之后，后台接收到请求，从数据
        • 前端CSS面试常见题 剑亦未配妥 前端面试前端css面试
          边界塌陷盒模型有两种：W3C盒模型和IE盒模型，区别在于宽度是否包含边框定义：同时给兄弟/父子盒模型设置上下边距，理论上边距值是两者之和，实际上不是注意：浮动和定位不会产生边界塌陷；只有块级元素垂直方向才会产生margin合并margin计算方案margin同为正负：取绝对值大的值一正一负：求和父子元素边界塌陷解决父元素可以通过调整padding处理；设置overflowhidden，触发BFC子
        • 【JS】前端文件读取FileReader操作总结 程序员-张师傅 前端前端javascript开发语言
          前端文件读取FileReader操作总结FileReader是JavaScript中的一个WebAPI，它允许web应用程序异步读取用户计算机上的文件（或原始数据缓冲区）的内容，例如读取文件以获取其内容，并在不将文件发送到服务器的情况下在客户端使用它。这对于处理图片、文本文件等非常有用，尤其是当你想要在用户界面中即时显示文件内容或进行文件预览时。创建FileReader对象首先，你需要创建一个Fi
        • 【前端】vue 报错:The template root requires exactly one element 程序员-张师傅 前端前端vue.jsjavascript
          【前端】vue报错:Thetemplaterootrequiresexactlyoneelement在Vue.js中，当你遇到错误“Thetemplaterootrequiresexactlyoneelement”时，这通常意味着你的Vue组件的模板（template）根节点不是单一的元素。Vue要求每个组件的模板必须有一个根元素来包裹所有的子元素。这个错误通常出现在以下几种情况：模板中有多个并行
        • 从单体到微服务：FastAPI ‘挂载’子应用程序的转变 黑金IT fastapi微服务fastapi架构
          在现代Web应用开发中，模块化架构是一种常见的设计模式，它有助于将大型应用程序分解为更小、更易于管理的部分。FastAPI，作为一个高性能的PythonWeb框架，提供了强大的支持来实现这种模块化设计。通过“挂载”子应用程序，我们可以为不同的功能区域（如前端接口、管理员接口和用户中心）创建独立的应用程序，并将它们整合到一个主应用程序中。本文将详细介绍如何在FastAPI中使用“挂载”子应用程序的方
        • 创建一个完整的购物商城系统是一个复杂的项目，涉及前端（用户界面）、后端（服务器逻辑）、数据库等多个部分。由于篇幅限制，我无法在这里提供一个完整的系统代码，但我可以分别给出一些关键部分的示例代码，涵盖几 uthRaman 前端ui服务器
          前端（HTML/CSS/JavaScript）grsyzp.cnHTML页面结构（index.html）html购物商城欢迎来到购物商城JavaScript（Ajax请求商品数据，app.js）javascriptdocument.addEventListener('DOMContentLoaded',function(){fetch('/api/products').then(response=
        • 了解 UNPKG：前端开发者的包管理利器 小于负无穷 前端javascripttypescriptcsshtml5node.js
          在现代前端开发中，JavaScript包管理和模块化是至关重要的，而npm则是最流行的JavaScript包管理器之一。不过，随着前端项目复杂性的增加，有时候我们希望快速引入外部依赖，而无需本地安装和构建。此时，CDN（内容分发网络）成为了一种方便快捷的解决方案，而UNPKG就是这种方式中的佼佼者。什么是UNPKG？UNPKG是一个基于npm的内容分发网络（CDN），它允许开发者直接通过URL从n
        • 前端three.js的Sprite模拟下雪动画效果 qq_35430208 three.js前端javascript三维场景中下雪效果threejs实现下雪效果
          一、效果如图所示：二、原理同下雨一样三、完整代码：index.jsimport*asTHREEfrom'three';import{OrbitControls}from'three/addons/controls/OrbitControls.js';importmodelfrom'./model.js';//模型对象//场景constscene=newTHREE.Scene();scene.add
        • 系列3：【深入】qiankun动态与按需加载子应用—像电影一样控制出现时机 rabbit_it qiankun学习前端框架前端阿里云
          一、引言：为何需要动态加载在现代前端开发中，性能优化始终是一个关键问题。对于微前端架构而言，管理多个子应用带来了前所未有的灵活性，但也对资源的加载和使用效率提出了更高要求。假设你的微前端项目就像一场电影，而子应用是场景或演员。在不同的情节中，我们只需要特定的场景和演员出现，而不需要所有场景和演员一开始就站在舞台上等待。这时，动态加载和按需加载就成为了关键工具——让需要的内容在正确的时机上场，节省性
        • ODOO不同版本与平台选择 chouchengyin2080 c#操作系统运维
          1.10.0vs11.0vs8.0截至2017年底，最新的ODOO发布版为ODOO11.0，但功能上有一定精简（去除财务模块，去除工作流支持），技术上变动较大（代码逐步迁移至Python3，前端框架改写得抽象）。所以如果是从生产使用的角度来讲，ODOO10.0是当前最好选择，因为其更稳定，第三方模块也更多更全面。而如果是ODOO技术爱好从业者，则逐步迁移至ODOO11.0也有必要，因为其底层技术架
        • Nuxt Kit 自动导入功能：高效管理你的模块和组合式函数 qcidyu 好用的工具集合代码效率前端技巧Vue开发组合式函数模块管理自动导入NuxtKit
          title:NuxtKit自动导入功能：高效管理你的模块和组合式函数date:2024/9/14updated:2024/9/14author:cmdragonexcerpt:通过使用NuxtKit的自动导入功能，您可以更高效地管理和使用公共函数、组合式函数和VueAPI。无论是单个导入、目录导入还是从第三方模块导入，您都可以通过简单的API调用轻松实现。categories:前端开发tags:N
        • Dom 周华华 JavaScripthtml
          <!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&q
        • 【Spark九十六】RDD API之combineByKey bit1129 spark
          1. combineByKey函数的运行机制   RDD提供了很多针对元素类型为(K,V)的API，这些API封装在PairRDDFunctions类中，通过Scala隐式转换使用。这些API实现上是借助于combineByKey实现的。combineByKey函数本身也是RDD开放给Spark开发人员使用的API之一   首先看一下combineByKey的方法说明：
        • msyql设置密码报错：ERROR 1372 (HY000): 解决方法详解 daizj mysql设置密码
          MySql给用户设置权限同时指定访问密码时，会提示如下错误： ERROR 1372 (HY000): Password hash should be a 41-digit hexadecimal number；   问题原因：你输入的密码是明文。不允许这么输入。   解决办法：用select password('你想输入的密码');查询出你的密码对应的字符串， 然后
        • 路漫漫其修远兮 吾将上下而求索 周凡杨 学习 思索
          王国维在他的《人间词话》中曾经概括了为学的三种境界古今之成大事业、大学问者，罔不经过三种之境界。“昨夜西风凋碧树。独上高楼，望尽天涯路。”此第一境界也。“衣带渐宽终不悔，为伊消得人憔悴。”此第二境界也。“众里寻他千百度，蓦然回首，那人却在灯火阑珊处。”此第三境界也。学习技术，这也是你必须经历的三种境界。第一层境界是说，学习的路是漫漫的，你必须做好充分的思想准备，如果半途而废还不如不要开始。这里，注
        • Hadoop(二)对话单的操作 朱辉辉33 hadoop
          Debug： 1、 A = LOAD '/user/hue/task.txt' USING PigStorage(' ') AS (col1,col2,col3); DUMP A; //输出结果前几行示例： (>ggsnPDPRecord(21),,) (-->recordType(0),,) (-->networkInitiation(1),,)
        • web报表工具FineReport常用函数的用法总结（日期和时间函数） 老A不折腾 finereport报表工具web开发
          web报表工具FineReport常用函数的用法总结（日期和时间函数）   说明：凡函数中以日期作为参数因子的，其中日期的形式都必须是yy/mm/dd。而且必须用英文环境下双引号(" ")引用。   DATE DATE(year,month,day):返回一个表示某一特定日期的系列数。 Year:代表年，可为一到四位数。 Month:代表月份。
        • c++ 宏定义中的##操作符 墙头上一根草 C++
          #与##在宏定义中的--宏展开 #include <stdio.h> #define f(a,b) a##b #define g(a)   #a #define h(a) g(a) int main() {       &nbs
        • 分析Spring源代码之，DI的实现 aijuans springDI现源代码
          (转) 分析Spring源代码之，DI的实现 2012/1/3 by tony                 接着上次的讲，以下这个sample [java]  view plain copy print
        • for循环的进化 alxw4616 JavaScript
          // for循环的进化 // 菜鸟 for (var i = 0; i < Things.length ; i++) { // Things[i] } // 老鸟 for (var i = 0, len = Things.length; i < len; i++) { // Things[i] } // 大师 for (var i = Things.le
        • 网络编程Socket和ServerSocket简单的使用 百合不是茶 网络编程基础IP地址端口
            网络编程;TCP/IP协议   网络:实现计算机之间的信息共享,数据资源的交换   协议:数据交换需要遵守的一种协议,按照约定的数据格式等写出去   端口:用于计算机之间的通信      每运行一个程序，系统会分配一个编号给该程序，作为和外界交换数据的唯一标识 0~65535   查看被使用的
        • JDK1.5 生产消费者 bijian1013 javathread生产消费者java多线程
          ArrayBlockingQueue：        一个由数组支持的有界阻塞队列。此队列按 FIFO（先进先出）原则对元素进行排序。队列的头部 是在队列中存在时间最长的元素。队列的尾部 是在队列中存在时间最短的元素。新元素插入到队列的尾部，队列检索操作则是从队列头部开始获得元素。 ArrayBlockingQueue的常用方法：
        • JAVA版身份证获取性别、出生日期及年龄 bijian1013 java性别出生日期年龄
                  工作中需要根据身份证获取性别、出生日期及年龄，且要还要支持15位长度的身份证号码，网上搜索了一下，经过测试好像多少存在点问题，干脆自已写一个。 CertificateNo.java package com.bijian.study; import java.util.Calendar; import
        • 【Java范型六】范型与枚举 bit1129 java
          首先，枚举类型的定义不能带有类型参数，所以，不能把枚举类型定义为范型枚举类，例如下面的枚举类定义是有编译错的   public enum EnumGenerics<T> { //编译错，提示枚举不能带有范型参数 OK, ERROR; public <T> T get(T type) { return null;
        • 【Nginx五】Nginx常用日志格式含义 bit1129 nginx
          1. log_format 1.1 log_format指令用于指定日志的格式，格式：   log_format name(格式名称) type(格式样式)   1.2 如下是一个常用的Nginx日志格式：   log_format main '[$time_local]|$request_time|$status|$body_bytes
        • Lua 语言 15 分钟快速入门 ronin47 lua 基础
          - - 单行注释 - - [[      [多行注释] - - ]]   - - - - - - - - - - - 1. 变量 & 控制流 - - - - - - - - - - num = 23 - - 数字都是双精度 str = 'aspythonstring'
        • java-35.求一个矩阵中最大的二维矩阵 ( 元素和最大 ) bylijinnan java
          the idea is from: http://blog.csdn.net/zhanxinhang/article/details/6731134 public class MaxSubMatrix { /**see http://blog.csdn.net/zhanxinhang/article/details/6731134 * Q35 求一个矩阵中最大的二维
        • mongoDB文档型数据库特点 开窍的石头 mongoDB文档型数据库特点
          MongoDD: 文档型数据库存储的是Bson文档-->json的二进制 特点：内部是执行引擎是js解释器，把文档转成Bson结构，在查询时转换成js对象。 mongoDB传统型数据库对比    传统类型数据库：结构化数据，定好了表结构后每一个内容符合表结构的。也就是说每一行每一列的数据都是一样的    文档型数据库：不用定好数据结构，
        • [毕业季节]欢迎广大毕业生加入JAVA程序员的行列 comsci java
              一年一度的毕业季来临了。。。。。。。。      正在投简历的学弟学妹们。。。如果觉得学校推荐的单位和公司不适合自己的兴趣和专业，可以考虑来我们软件行业，做一名职业程序员。。。      软件行业的开发工具中，对初学者最友好的就是JAVA语言了，网络上不仅仅有大量的
        • PHP操作Excel – PHPExcel 基本用法详解 cuiyadll PHPExcel
          导出excel属性设置//Include classrequire_once('Classes/PHPExcel.php');require_once('Classes/PHPExcel/Writer/Excel2007.php');$objPHPExcel = new PHPExcel();//Set properties 设置文件属性$objPHPExcel->getProperties
        • IBM Webshpere MQ Client User Issue (MCAUSER) darrenzhu IBMjmsuserMQMCAUSER
          IBM MQ JMS Client去连接远端MQ Server的时候，需要提供User和Password吗？ 答案是根据情况而定，取决于所定义的Channel里面的属性Message channel agent user identifier (MCAUSER)的设置。 http://stackoverflow.com/questions/20209429/how-mca-user-i
        • 网线的接法 dcj3sjt126com
          一、PC连HUB (直连线)A端：（标准568B）：白橙，橙，白绿，蓝，白蓝，绿，白棕，棕。 B端：（标准568B）：白橙，橙，白绿，蓝，白蓝，绿，白棕，棕。 二、PC连PC （交叉线）A端：(568A)： 白绿，绿，白橙，蓝，白蓝，橙，白棕，棕； B端：（标准568B）：白橙，橙，白绿，蓝，白蓝，绿，白棕，棕。 三、HUB连HUB&nb
        • Vimium插件让键盘党像操作Vim一样操作Chrome dcj3sjt126com chromevim
          什么是键盘党？ 键盘党是指尽可能将所有电脑操作用键盘来完成，而不去动鼠标的人。鼠标应该说是新手们的最爱，很直观，指哪点哪，很听话！不过常常使用电脑的人，如果一直使用鼠标的话，手会发酸，因为操作鼠标的时候，手臂不是在一个自然的状态，臂肌会处于绷紧状态。而使用键盘则双手是放松状态，只有手指在动。而且尽量少的从鼠标移动到键盘来回操作，也省不少事。 在chrome里安装 vimium 插件
        • MongoDB查询（2）——数组查询[六] eksliang mongodbMongoDB查询数组
          MongoDB查询数组 转载请出自出处：http://eksliang.iteye.com/blog/2177292 一、概述  MongoDB查询数组与查询标量值是一样的，例如，有一个水果列表，如下所示： > db.food.find() { "_id" : "001", "fruits" : [ "苹
        • cordova读写文件（1） gundumw100 JavaScriptCordova
          使用cordova可以很方便的在手机sdcard中读写文件。 首先需要安装cordova插件：file 命令为： cordova plugin add org.apache.cordova.file 然后就可以读写文件了，这里我先是写入一个文件，具体的JS代码为： var datas=null;//datas need write var directory=&
        • HTML5 FormData 进行文件jquery ajax 上传 到又拍云 ileson jqueryAjaxhtml5FormData
          html5 新东西：FormData  可以提交二进制数据。 页面test.html <!DOCTYPE> <html> <head> <title> formdata file jquery ajax upload</title> </head> <body> <
        • swift appearanceWhenContainedIn:(version1.2 xcode6.4) 啸笑天 version
            swift1.2中没有oc中对应的方法： + (instancetype)appearanceWhenContainedIn:(Class <UIAppearanceContainer>)ContainerClass, ... NS_REQUIRES_NIL_TERMINATION;  解决方法： 在swift项目中新建oc类如下： #import &
        • java实现SMTP邮件服务器 macroli java编程
          电子邮件传递可以由多种协议来实现。目前，在Internet 网上最流行的三种电子邮件协议是SMTP、POP3 和 IMAP，下面分别简单介绍。 　　◆ SMTP 协议 　　简单邮件传输协议(Simple Mail Transfer Protocol,SMTP)是一个运行在TCP/IP之上的协议，用它发送和接收电子邮件。SMTP 服务器在默认端口25上监听。SMTP客户使用一组简单的、基于文本的
        • mongodb group by having where 查询sql qiaolevip 每天进步一点点学习永无止境mongo纵观千象
          SELECT cust_id, SUM(price) as total FROM orders WHERE status = 'A' GROUP BY cust_id HAVING total > 250 db.orders.aggregate( [ { $match: { status: 'A' } }, { $group: {
        • Struts2 Pojo（六） Luob. POJOstrust2
          注意：附件中有完整案例 1.采用POJO对象的方法进行赋值和传值 2.web配置 <?xml version="1.0" encoding="UTF-8"?> <web-app version="2.5" xmlns="http://java.sun.com/xml/ns/javaee&q
        • struts2步骤 wuai struts
          1、添加jar包 2、在web.xml中配置过滤器 <filter>        <filter-name>struts2</filter-name>        <filter-class>org.apache.st

        按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他

        首页 - 关于我们 - 站内搜索 - Sitemap - 侵权投诉

        版权所有 IT知识库 CopyRight © 2000-2050 E-COM-NET.COM , All Rights Reserved.