【web前端基础知识】
web前端知识梳理,适合初学者
月疯
得到你最想要的东西,最保险的办法,那就是你能配得上你最想要的东西。机会是留给有准备的人,运气是留给有天赋的努力者。
展开
-
网络框架axios
官网:http://www.axios-js.com/zh-cn/docs/什么是 axios?Axios 是一个基于 promise 的 HTTP 库,可以用在浏览器和 node.js 中。特性从浏览器中创建XMLHttpRequests 从 node.js 创建http请求 支持PromiseAPI 拦截请求和响应 转换请求数据和响应数据 取消请求 自动转换 JSON 数据 客户端支持防御XSRF安装使用 npm:$ npm insta...原创 2021-08-20 12:05:32 · 173 阅读 · 0 评论 -
ElementUI组件库
官网:https://element.eleme.cn/#/zh-CN/component/installationnpm 安装推荐使用 npm 的方式安装,它能更好地和webpack打包工具配合使用。npm i element-ui -SCDN目前可以通过unpkg.com/element-ui获取到最新版本的资源,在页面上引入 js 和 css 文件即可开始使用。<!-- 引入样式 --><link rel="stylesheet" href=...原创 2021-08-17 10:47:22 · 7232 阅读 · 0 评论 -
javaWeb(入门基础详解)
Servlet1,servlet介绍 servlet是一项动态web资源开发技术. 运行在服务器端. 作用:处理业务逻辑,生成动态的内容,返回给浏览器. 本质就是一个类 servlet的入门 1.编写servlet(类)--- 继承HttpServlet 2.编写关系--- w...原创 2019-06-28 00:56:07 · 121 阅读 · 0 评论 -
org.apache.commons.io如何使用
FileUtils类的应用1、写入一个文件;2、从文件中读取;3、创建一个文件夹,包括文件夹;4、复制文件和文件夹;5、删除文件和文件夹;6、从URL地址中获取文件;7、通过文件过滤器和扩展名列出文件和文件夹;8、比较文件内容;9、文件最后的修改时间;10、计算校验和。一、 复制文件或文件夹方法:public class CopyFileorDir...翻译 2018-11-12 13:30:42 · 1477 阅读 · 0 评论 -
java名词解释
JavaBean, Spring bean 和 POJO 是三个被广泛使用的术语,我们来看看它们的含义,以及分析三者的区别。JavaBeans根本而言,JavaBean只是遵循了特定编码规范的Java类而已。例如:包含默认(无参数)的构造函数允许通过访问器(getter和setter方法)来访问类的成员属性实现java.io.Serializable接口准确来说,JavaBean是遵循了Sun制定...翻译 2018-05-23 15:54:45 · 686 阅读 · 0 评论 -
apache-commons 常用工具类
引用包说明本文引用的所有包如下<dependency> <groupId>org.apache.commons</groupId> <artifactId>commons-lang3</artifactId> <version>3.4</version></dependen...转载 2020-01-04 20:48:24 · 897 阅读 · 0 评论 -
MintUI介绍
官网:http://mint-ui.github.io/#!/zh-cn// 安装# Vue 1.xnpm install mint-ui@1 -S# Vue 2.0npm install mint-ui -S// 引入全部组件import Vue from 'vue';import Mint from 'mint-ui';Vue.use(Mint);// 按需引入部分组件import { Cell, Checklist } from 'mint-ui';Vue.com原创 2021-08-17 10:54:55 · 385 阅读 · 0 评论 -
Java之AOP解释
Aop是一种变成范式与语言无关,是一种程序设计思想面向切面(AOP)Aspect Oriented Programming面向对象(OOP)Object Oriented Programming面向过程(POP)Procedure Oriented ProgrammingC语言就是面向过程 Aop就是将通用逻辑从业务逻辑中分离出来...原创 2018-12-13 22:22:20 · 538 阅读 · 0 评论 -
javaWeb三大框架总结
一、Struts2的总结1、Struts 2的工作流程,从请求说起(1)客户端浏览器发出HTTP请求。(2)根据web.xml配置,该请求被FilterDispatcher接收。(3)根据struts.xml配置,找到需要调用的Action类和方法,经过一系列的拦截器(Interceptor)执行后,程序执行到action中的指定的方法, 并且从前台接收的参数通过IoC方式,将值注入给Aciton...转载 2018-04-08 15:59:58 · 2028 阅读 · 0 评论 -
bootStrap库介绍
官网地址:https://www.bootcss.com/这是一个基于jquery的框架。Bootstrap 是全球最受欢迎的前端框架,用于构建响应式、移动设备优先的网站。利用 jsDelivr 和我们提供的入门模板帮助你快速掌握 Bootstrap。支持的浏览器Bootstrap 支持所有主流浏览器和平台的最新、稳定版本。在 Windows 上,我们支持 Internet Explorer 10-11 / Microsoft Edge 浏览器。对于其它使用了最新版本的 WebKit.原创 2021-08-18 19:48:41 · 1392 阅读 · 0 评论 -
javaWEB的三大组件(入门基础总结)
Javaweb三大组件 Servlet、Filter、Listener.一:Servlet的作用: 接受请求参数、处理请求,响应结果二:Servlet的生命周期 void init(ServletConfig):初始化调用一次 void service(ServletRequest request, ServletResponse response):每次处理请求时候调用 void dest...原创 2018-04-08 10:27:17 · 2729 阅读 · 0 评论 -
引入jQuery的src设置
1.引用在线jQuery谷歌、微软、百度都有提供在线的jQuery引用。比如<script src="http://code.jquery.com/jquery-latest.js"></script>2.引用本地的jQuery。先在下载jQuery.js文件或者jQuery.min.js文件(这个是压缩版的),放在项目中。假如jQuery文件和当前js...转载 2019-01-10 18:35:03 · 3156 阅读 · 0 评论 -
jquery笔记01
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <script src="jquery/jquery-1.8.3.min.js&quo原创 2018-12-12 23:49:37 · 123 阅读 · 0 评论 -
php基础语法笔记
js定义变量:var num=10;$num=10;Js中打印内容:console.log();echo $num;js中定义集合1\js中如何定义数组var arr=[1,2,3];arr[0]$arr=array(1,2,3);Print_r($arr);echo “<br>”echo $arr[1]2\js中如何定义字典var dict={“n...原创 2018-12-13 11:44:52 · 180 阅读 · 0 评论 -
滚动插件jQuery Marquee
官方地址:http://plugins.jquery.com/marquee/引入方式:<script type="text/javascript" src="../marqueed/jquery.marquee.js"></script>常用的属性: 参数 描述 direction 方向,默认为left duration...原创 2018-12-20 17:46:25 · 1022 阅读 · 0 评论 -
html总结
<div> 块,末尾会换行。一个div可以包含标题、段落、链接等。div属于容器<p> 段落,末尾会换行。<a> 链接 <a href="index.html">首页</a><input> 用于输入。根据属性Type的不同,输入字段可以是文本字段、复选框、掩码后的文本控件、单选按钮、按钮等原创 2019-01-10 19:02:29 · 135 阅读 · 0 评论 -
jQuery菜鸟总结
一、基本语法1.注意:jquery的<script> 标签应该位于页面的 <head> 里面。jquery的在线文件有很多,谷歌,微软都可以。加入以下<script>即可使用jQuery<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/...转载 2019-01-10 18:32:56 · 185 阅读 · 0 评论 -
FormData提交数据
在jquery中,使用ajax提交表单数据。FormData可以很方便地获取到表单中的所有数据。注意: ajax中的data参数为FormData类型时,contentType就不要设置成application/json了。如果contentType设置成application/json,需要将FormData转换为json示例如下:<script type="text...转载 2019-01-10 18:39:19 · 955 阅读 · 0 评论 -
AJAX笔记
一、基础概念AJAX = Asynchronous JavaScript and XML(异步的 JavaScript 和 XML)。AJAX 不是新的编程语言,而是一种使用现有标准的新方法。AJAX 可以在不重新加载整个页面的情况下,与服务器交换数据并更新部分网页(局部刷新)XMLHttpRequest 用于在后台与服务器交换数据。二、相关api1.识别浏览器并创建对象:...转载 2019-01-10 18:37:41 · 159 阅读 · 0 评论 -
ajax传递map参数给后端
向后端传递一个参数/** * 前端ajax代码部分 */var map = '{"account":"' + account + '"}';//设定一个事件触发ajax$.ajax({ type : 'POST', contentType : 'application/json;charset=utf-8', url : "/", processD...转载 2018-12-27 11:36:01 · 18647 阅读 · 0 评论 -
jquery请求后台数据(get请求)
直接上代码:<input type="button" id="fileImport" value="读取服务器文件">//点击导入按钮,使files触发点击事件,然后完成读取文件的操作 $(document).ready(function(){ $("#fileImport").click(function(){ $.ge...原创 2019-07-18 12:10:35 · 3252 阅读 · 0 评论 -
jquery的get和post请求
第一种方式:手工填写所有表单数据<!DOCTYPE html><html><head><meta charset="UTF-8"><title>Insert title here</title> <script type="text/javascript"&g转载 2018-12-24 15:43:22 · 466 阅读 · 0 评论 -
多个div在同一行显示
使用float:left,也可以使用display : inline-block,可以使多个div在同一行显示。<div class="search_row"> <div class="form-group" style="float:left" > <%-- 通过左浮动使多个div在一行显示--%> &l转载 2019-01-10 18:56:12 · 36370 阅读 · 1 评论 -
span组件内容的刷新(笔记)
span是最简单的容器,可以当作一个形式标签,其取值赋值方法有别于一般的页面元素。//赋值$("#spanid").html(value)//取值$("#spanid").text()假设我有一个<span id="text"></span>现在我要单击一个按钮后让span中显示“Hello,World!”。<input id="sh.转载 2018-12-24 18:36:43 · 1755 阅读 · 0 评论 -
html的标签位置属性(学习笔记)
div:定义位置有两种方式:一种是使用相对位置,一是使用绝对位置。绝对定位有两个属性:left和top,分别是距离网页左边和网页顶部的绝对位置。借助style属性,按照如下的格式进行设置:style = "position:absolute;left:距离左边距离;top:距离顶部距离"例如:<div name = "mydiv" id="mydiv" style="po...转载 2018-12-23 12:52:51 · 25161 阅读 · 0 评论 -
jquery笔记02
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <script src="jquery/jquery-1.8.3.min.js&quo原创 2018-12-13 00:07:00 · 113 阅读 · 0 评论 -
css总结
1.选择器:id具有唯一性,通过#定义 class可重复,通过.定义:focus 选择器用于选取获得焦点的元素。示例如下: class为 start_time的控件的样式及获得焦点后的样式。.start_time { width: 150px; margin-right: 10px; color: #122e29;}/*选中后的样式...转载 2019-01-10 18:58:05 · 126 阅读 · 0 评论 -
CSS的样式小计(1)
1、给div添加点击效果:.item { background: #FFF;}.item:active { background: #F0F0F0;}2、鼠标滑过,出现高亮div:hover{ background: chartreuse; }3、设置圆或者圆角1.border-radius可以同时设置1到4个值。简洁法 如果设置1个值,表示4个圆角都使用这个值。 border-radius:40px;原创 2021-07-24 16:20:07 · 196 阅读 · 1 评论 -
web框架集合
web前端的各种框架包:Bootstrap中文网 (bootcss.com)是前端学习的一个好网站!!!!!!!原创 2021-04-25 01:04:37 · 127 阅读 · 0 评论 -
HTML5新特性
什么是H5h5指的是一系列技术做的移动端ppt,它的页面很酷炫,可以提高公司的逼格,亮瞎访问者的双眼,让小白顿生膜拜之感,即使ppt毫无实质,使用大量的插件或库,主要技术有:1.页面素材加载技术,使用使用createJS之中的preloadJS(现成的库)2.音乐加载播放技术,createJS中同样有soundJS可以实现(又是它)3.可以滑动的页面,这不就是ppt吗?用了swiper.js这个Jquery插件(又是库)4.可以随意涂抹修改,使用canvas叠加层,canvas是HTML5标..转载 2021-04-15 14:23:14 · 236 阅读 · 0 评论 -
html的document操作
代码:<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>document测试</title> <!-- DOM操作--- 如何添加、移除、移动、复制、创建和查找节点等 (1)创建新节点 createDocumentFragment()//创建一个DOM片段 createElemen...原创 2021-04-15 14:11:07 · 2538 阅读 · 0 评论 -
css3中的box-sizing属性的使用
box-sizing属性用来定义元素的width和height所表示的区域,该属性一般有三种值:content-box、border-box、inherit。其中inherit表示box-sizing的值应该从父元素继承。content-box和border-box的主要区别就是元素的width和height的值包不包括border、padding这两个属性的值。一、content-box content-box也叫标准盒子模型,是默认值。 它的width组成仅仅只有content区..转载 2021-04-15 13:51:40 · 981 阅读 · 0 评论 -
html居中方式
代码一:<!DOCTYPE html><!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> *原创 2021-04-15 12:28:33 · 948 阅读 · 0 评论 -
a标签详解与测试
代码部分:<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> </head> <body> <span>今天学习a标签</span> </br> <a href="#">跳转到顶部</a> </br> <a原创 2021-04-09 21:01:17 · 258 阅读 · 0 评论 -
js调用本地js文件(亲测)
jsty.html:<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>调用外部js代码</title> <script type="text/javascript" src="../js/plus.js"> </script> </head> <body> <form> ..原创 2021-04-09 13:24:18 · 3405 阅读 · 0 评论 -
html之table删除和添加数据(获取行号和列号)
代码:<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> </head> <style type="text/css"> #t{ width: 800px; height: 80px; } </style> <body> <div id="df原创 2021-04-08 21:51:16 · 1262 阅读 · 0 评论 -
table加载动态数据(亲测)
直接上代码:<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>表格展示</title> <style type="text/css"> #table{ border-collapse: collapse; 单条显示 margin: 0 auto; text-align: center; } ..原创 2021-04-08 16:59:18 · 1315 阅读 · 0 评论 -
百分比布局测试
<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <style type="text/css"> body{ height 100%; margin: 0; padding: 0; } #header{ width: 100%; height: 15%; b.原创 2021-04-06 19:52:25 · 114 阅读 · 0 评论 -
Hbuilderx编辑器介绍(00)
登录官网:https://www.dcloud.io/点击下载:解压之后,直接打开使用开始编写程序:原创 2020-02-22 17:00:31 · 2498 阅读 · 0 评论 -
web前端基础(15正则表达)
<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <!-- 正则表达式 (描述字符模式的对象)主要用来验证客户端的数据验证--> <!-- 一个正则表达式是由普通字符串(a-z)特殊字符...原创 2020-02-22 16:55:13 · 437 阅读 · 0 评论