Web前端
关注
分享
扫一扫
冯晓如
我就是IT初学者，Csdn就是激励我平时可以每天总结知识点的文件。
展开
专栏收录文章
- 默认排序
- 最新发布
- 最早发布
- 最多阅读
- 最少阅读
-
正则表达式概述
正则表达式正则表达式（ Regular Expression ）是用于匹配字符串中字符组合的模式。在JavaScript中，正则表达式也是对象。正则表通常被用来检索、替换那些符合某个模式（规则）的文本，例如验证表单：用户名表单只能输入英文字母、数字或者下划线， 昵称输入框中可以输入中文(匹配)。此外，正则表达式还常用于过滤掉页面内容中的一些敏感词(替换)，或从字符串中获取我们想要的特定部分(提...原创 2019-11-24 22:23:45 · 246 阅读 · 0 评论 -
正则表达式中的特殊字符
正则表达式中的特殊字符组成一个正则表达式可以由简单的字符构成，比如 /abc/，也可以是简单和特殊字符的组合，比如 /ab*c/ 。其中特殊字符也被称为元字符，在正则表达式中是具有特殊意义的专用符号，如 ^ 、$ 、+ 等。特殊字符非常多，可以参考：MDNjQuery 手册：正则表达式部分边界符正则表达式中的边界符（位置符）用来提示字符所处的位置，主要有两个字符边界符说明...原创 2019-11-24 22:16:09 · 15152 阅读 · 0 评论 -
函数的定义和调用
定义方式方式1 函数声明方式 function 关键字 (命名函数)function fn(){}方式2 函数表达式(匿名函数)var fn = function(){}方式3 new Function()var f = new Function('a', 'b', 'console.log(a + b)');f(1, 2);var fn = new Functi...原创 2019-11-22 22:48:31 · 455 阅读 · 0 评论 -
js构造函数和原型
构造函数和原型构造函数原型prototype构造函数通过原型分配的函数是所有对象所共享的。JavaScript 规定，每一个构造函数都有一个prototype 属性，指向另一个对象。注意这个prototype就是一个对象，这个对象的所有属性和方法，都会被构造函数所拥有。我们可以把那些不变的方法，直接定义在 prototype 对象上，这样所有对象的实例就可以共享这些方法。function...原创 2019-11-21 21:10:38 · 268 阅读 · 0 评论 -
jQuery事件
4种常见的注册事件jQuery 事件委派的优点以及方式绑定事件与解绑事件jQuery 对象的拷贝方法jQuery 多库共存的2种方法jQuery 插件jQuery 事件注册 jQuery 为我们提供了方便的事件注册机制，是开发人员抑郁操作优缺点如下：优点: 操作简单，且不用担心事件覆盖等问题。缺点: 普通的事件注册不能做事件委托，且无法实现事件解绑，需要借助其他方法。...原创 2019-11-19 21:32:59 · 152 阅读 · 0 评论 -
jQuery 属性、元素、尺寸、位置操作
jQuery 属性操作 jQuery 常用属性操作有三种：prop() / attr() / data() ;元素固有属性值 prop() 所谓元素固有属性就是元素本身自带的属性，比如 元素里面的 href ，比如 元素里面的 type。 注意：prop() 除了普通属性操作，更适合操作表单属性：disabled / checked / selected 等。元素自定义属性值 ...原创 2019-11-18 20:23:25 · 208 阅读 · 0 评论 -
jQuery基础知识
jQuery基础知识能够说出 DOM 对象和 jQuery 对象的区别常用的 jQuery 选择器操作 jQuery 样式jQueryjQuery 是一个快速、简洁的 JavaScript 库，其设计的宗旨是“write Less，Do More”，即倡导写更少的代码，做更多的事情。j 就是 JavaScript； Query 查询； 意思就是查询js，把js中的DOM...原创 2019-11-17 22:38:43 · 144 阅读 · 0 评论 -
js移动端基础知识
day07 - Web APIs学习目标:能够写出移动端触屏事件能够写出常见的移动端特效能够使用移动端开发插件开发移动端特效能够使用移动端开发框架开发移动端特效能够写出 sessionStorage 数据的存储以及获取能够写出 localStorage 数据的存储以及获取能够说出它们两者的区别1.1. 触屏事件1.1.1 触屏事件概述移动端浏览器兼容性较好，我们不需要考虑...原创 2019-11-16 23:07:01 · 503 阅读 · 0 评论 -
js简单动画了解，触屏事件
day06 - Web APIs学习目标:能够封装简单动画函数能够理解缓动动画的封装能够使用动画函数能够写出网页轮播图案例能够写出移动端触屏事件**1.1. **动画函数封装1.1.1 缓动效果原理缓动动画就是让元素运动速度有所变化，最常见的是让速度慢慢停下来思路：让盒子每次移动的距离慢慢变小，速度就会慢慢落下来。核心算法： (目标值 - 现在的位置) &...原创 2019-11-15 21:42:50 · 207 阅读 · 0 评论 -
js三大系列简单总结
day05 - Web APIs学习目标:能够说出常见 offset 系列属性的作用能够说出常见 client 系列属性的作用能够说出常见 scroll 系列属性的作用能够封装简单动画函数**1.1. **元素偏移量 offset 系列1.1.1 offset 概述offset 翻译过来就是偏移量， 我们使用 offset系列相关属性可以动态的得到该元素的位置（偏移）、大小等。...原创 2019-11-14 20:21:28 · 211 阅读 · 0 评论 -
bom,窗口，定时器
BOM定义：BOM（Browser Object Model）即浏览器对象模型，它提供了独立于内容而与浏览器窗口进行交互的对象，其核心对象是 window。BOM 由一系列相关的对象构成，并且每个对象都提供了很多方法与属性。BOM 缺乏标准，JavaScript 语法的标准化组织是 ECMA，DOM 的标准化组织是 W3C，BOM 最初是Netscape 浏览器标准的一部分。BOM的...原创 2019-11-13 21:35:02 · 220 阅读 · 0 评论 -
js函数和分支选择结构
1、函数1、什么是函数是一段预定义好，并可以被反复使用的代码块预定义：事先声明好反复使用：提升代码的可重用性代码块：允许包含多条可执行语句2、声明函数1、普通函数function 函数名(){//代码块}2、带参函数参数：由外部传入到函数内部的数据function 函数名(参数列表){}3、带返回值函数返回值：需要返回给函数调用处的一个数据function 函数名...原创 2019-11-12 21:47:40 · 407 阅读 · 0 评论 -
JS——简单实现Ajax步骤
Ajax（Asynchronous JavaScript + XML）使得浏览器可以额外地向服务器请求数据而不用重新刷新页面，ajax从服务器或许到数据后，可用javascript操作DOM以改变页面。定义XMLHttpRequest实现ajax的核心是XMLHttpRequest对象，其使用主要是open()、send()等函数。实现异步通信一班需要以下四步：第一步：定义对象第二步：调...原创 2019-11-11 21:37:21 · 1030 阅读 · 0 评论 -
js操作CSS样式简单案例
js操作CSS样式简单案例案例1.设计网页换肤js可实现用户对页面中的选择条件改变页面中的样式，页面样式可以通过style修饰，也可以通过css修饰，先来看一下js改变style样式，代码如下：<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><html> <head> ...原创 2019-11-10 22:12:31 · 399 阅读 · 0 评论 -
JS——操作CSS样式
页面往往是动态变化的，我们经常需要在脚本里对元素的样式进行操作，刚学习js的时候大家都知道通过style属性设置css样式相关的属性，但有时候也想先获取样式，结果发现通过style取到的值是空，这就需要我们对这些概念足够熟练。一、访问行内样式：css样式包括三种：外部样式、内部样式、行内样式。这个style对象包含通过HTML的style属性设置的所有CSS样式信息，但不包含祥式表中的...原创 2019-11-09 23:08:19 · 1546 阅读 · 1 评论 -
操作DOM简单笔记
DOMDOM 给我们提供了一些方法，让我们可以使用js来控制页面中的标签等。作用：它的作用是将网页转为一个 JavaScript 对象，从而可以用脚本进行各种操作（比如增删内容）。浏览器会根据 DOM 模型，将结构化文档（比如 HTML 和 XML）解析成一系列的节点，再由这些节点组成一个树状结构（DOM Tree）。所有的节点和最终的树状结构，都有规范的对外接口。页面元素 – 页面中...原创 2019-11-08 19:49:35 · 253 阅读 · 0 评论 -
JS基础知识
1、JS概述1、什么是JSJS是一种运行于JS解释器/引擎中的解释型脚本语言 编译型语言：程序在运行前会进行编译解释型语言：运行之前不会编译，直接执行，出错则停止JS解释器/引擎：是JS脚本的运行环境 1、浏览器 Console 中直接输入脚本2、将JS嵌入在HTML页面中执行1、元素事件中< ANY οnclick="">console.log(“...原创 2019-11-07 19:56:22 · 251 阅读 · 0 评论 -
设计CSS动画
简单基础概念如下：1、转换1、什么是转换改变元素在页面中的大小，位置，角度和形状的一种方式2、转换分类1、2D转换使元素在x轴和y轴上发生变化效果2、3D转换在2D转换基础上，增加 z轴的变化效果3、转换属性属性：transform 取值：1、none默认值，不进行任何转换2、转换函数表示一个或者多个转换函数，如果是多个函数的话，中间以空格分开4、转换原点...原创 2019-11-06 19:59:24 · 412 阅读 · 0 评论 -
CSS媒体查询
CSS媒体查询媒体查询包含了一个媒体类型和至少一个使用如高度、宽度和颜色等媒体属性来限制样式表范围的表达式。CSS3加入的媒体查询使得无需修改内容便可以使样式应用于某些特定的设备范围，包含了一个媒体类型和如css3规范中描述的包含了一个或多个表达式的媒体属性，这些媒体属性会被解析成真或假。如果媒体查询中的媒体类型与文档要展示的设备相符则查询结果为真，并且媒体查询中的所有表达式为真。例子：&l...原创 2019-11-05 19:59:14 · 922 阅读 · 0 评论 -
CSS伸缩布局
CSS伸缩布局CSS flex 是一种伸缩布局，之前块级元素布局在同一行，可以通过display或position或float来实现，而flex 为和模型布局提供了极大地灵活性，所谓弹性布局即可根据大小判定自动伸缩。flex相关属性如下：1、display：flex；在父盒子定义flex，子盒子才能使用flex属性2、flex：none |flex-grow flex-shrink f...原创 2019-11-04 20:36:54 · 1667 阅读 · 0 评论 -
CSS排版网页
CSS盒模型盒模型是CSS布局的核心概念。认识display：使用CSS的display属性可以改变元素的显示类型，代码如下：display:属性值如下:none:隐藏对象inline：对象为内联元素，可以并列显示。block：对象为块元素 ，适合搭建文档框架。inline-block：对象为内联块元素认识CSS盒模型：CSS盒模型定义了网页对象的基本显示结构。每个元素都显示...原创 2019-11-03 15:24:54 · 1297 阅读 · 3 评论 -
CSS设计三栏伸缩页面
下面主要写了使用不同版本语法，设计一个兼容不同设备和浏览器的弹性页面。主要代码如下:<style type='text/css'>.page-wrap { display:-webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display:...原创 2019-11-02 21:59:55 · 375 阅读 · 1 评论 -
CSS美化图像按钮及表格
一、设计图形按钮链接使用css的background-image属性实现。代码如下：<style type="text/css">a.reg{ background: transparent url('ps做好的背景图') no-repeat top left; display: block; width: 74px; height: 25px ...原创 2019-11-01 21:21:25 · 1106 阅读 · 0 评论 -
HTML复杂表单制作
代码如下：<!DOCTYPE html><html><head> <meta charset="UTF-8"> <title>标题</title></head><body> <h1>修改个人性息</h1> <form> ...原创 2019-10-31 23:55:57 · 1662 阅读 · 0 评论 -
CSS美化超链接样式
美化超链接样式一、使用动态伪类注意！！！超链接的四种状态样式的排列是固定的，一般不能随意调换正确的顺序时Link，visited,hover,active当鼠标经过超链接是，会先执行第一行声明，但是紧接着第三行声明会覆盖掉第一行和第二行声明的样式，所以无法看到鼠标经过和被激活时的效果<style type="text/css">a:link{color: red;} ...原创 2019-10-30 21:57:26 · 9634 阅读 · 0 评论 -
利用CSS设计图像样式
设计图像样式一、定义图像大小：二、定义图像边框：三、定义不透明度：opacity:0-1/取值范围是0-1值越小，透明度越高，0为完全透明/四、定义圆角特效：五、定义阴影特效：代码如下：<html> <head> <style type='text/css'> /*.w200{ ...原创 2019-10-29 21:49:47 · 635 阅读 · 0 评论 -
HTML5设计网站结构简单设计
一、构建网页标题<header id="bloghead"> <div id="blogTitle"> <h1 id="blogname">HTML5+CSS3+JavaScript入门到精通</h1> <div id="bloglink">http://mysite.com/index.html...原创 2019-10-28 20:00:59 · 1324 阅读 · 0 评论 -
利用html简单自我介绍案例
案例实战：在网页标题栏中显示“自我介绍”文本信息以一级标题的形式显示“自我介绍”文本信息以定义列表下面以图像的形式插入个人的头像以段落文本形式显示个人简历 <html><head> <meta charset="UTF-8"> <meta http-equiv="Content-Type" content="text/html...原创 2019-10-27 22:36:57 · 38539 阅读 · 2 评论 -
表单----Web前端
作用：用于显示、手机用户信息，并将信息交给服务器表单组成： 表单元素、表单控件1、表单元素：负责将用户数据提交给服务器< form></ form>属性1、action表单提交时动作，主要就是服务器上处理，数据的应用程序URL默认 是提交给本页2、method只当表单数据提交方式1、get（默认值）向服务器端要数据时使用特点：显示提交：用户数据是可以...原创 2019-10-14 14:26:02 · 217 阅读 · 0 评论 -
结构标记----Web前端
1、作用 用于表示页面中的布局，目的是为了提升标记的语义化2、结构标记 1、<header>元素 1、语法 <header></header> 2、作用 定义文档的页眉 用于取代：<div id="header"></div> 2、<nav>元素 1、语法 <nav>&l...原创 2019-10-14 14:24:46 · 192 阅读 · 0 评论 -
列表----Web前端
1、什么是列表 按照一定的结构化方式显示数据，默认情况，是按照从上到下的方式来显示数据2、列表的组成 主要由 列表类型 和 列表项（具体显示在列表里边的内容） 来组成3、语法 1、有序列表 标记:<ol></ol> -- Order List 列表项：<li></li> <ol> <li>内容&l...原创 2019-10-14 14:23:57 · 350 阅读 · 0 评论 -
表格---Web前端
表格1、作用将数据 按照 从左到右，从上到下的顺序进行显示2、语法1、标记1、创建表格给表格弄空地< table >< /table>2、创建表行一行 < tr>< /tr> – table row3、创建列(单元格)< td></ td> – table data2、属性(重点)1、tablewi...原创 2019-09-23 08:14:24 · 250 阅读 · 0 评论 -
图像和链接---Web前端
1、URL 1、目录 & 目录结构 目录：WEB站点中文件夹的名称 目录结构：由目录以及子目录形成复杂结构 2、URL URL(Uniform Resource Locator) 统一资源定位符 作用：用来标识网络中资源的位置 资源：图片，网页，音视频... 俗称：路径(地址)URL在WEB页面上有三种表现形式:1、绝对路径2、相对路径3、根...原创 2019-09-20 11:45:07 · 291 阅读 · 0 评论 -
文档结构和标记-Web前端
1.文档类型声明作用：指定文档的版本和类型语法：页面最顶端<!doctype html> 2.html页面语法：< html>< /html> 又称为html根标记内容：即两个子元素1.< head>< /head>网页头部作用：定义页面中的全局信息包含如下内容：1.< title>网页标题<...原创 2019-09-18 08:44:20 · 485 阅读 · 2 评论 -
HTML快速入门——Web前端
1.HTML概述HTML（Hyper Text Markup Language）超文本标语言超文本：具备特殊功能的文本普通文本：a超文本 ：a,功能为超链接普通文本：b超文本 ：b,加粗显示文本标签：Markup，规范了超文本的组成形式超文本五年a：语言：Language，具备特定的语法规范HTML是网页的设计语言，由HTML编写的语言是以.html或.htm结尾。并且有...原创 2019-09-16 08:07:54 · 206 阅读 · 0 评论 -
Web基础知识--Web前端
1.Web 与 Internet（Internet是Web的一个运行环境 ）1.InternetInternet是一个全球性的计算机互联网络，中文名称“因特网”，“国际互联网”，“网际网”，“交互网络”Internet提供的主要服务：Telnet（远程），Email，WWW（World Wide Web）BBS（05.06年的论坛），FTP基本实现技术：1.分组交换原理（信息传递）...原创 2019-09-12 20:03:47 · 283 阅读 · 0 评论