
html、css、js
文章平均质量分 55
掌握前端相关知识
木鱼非鸟
把“坚持”坚持成习惯
展开
-
JavaScript小汇(6)——面向对象编程
文章目录面向对象编程原型对象class面向对象编程原型对象原型 (继承)var Person = { name:"www", age:10, run:function(){ console.log(this.name + "run..."); }}var s = { name:"xx"}s.__proto__ = Person;//可以理解为继承console.log(s.run());>xxrun...var Bi原创 2021-02-03 09:20:27 · 78 阅读 · 0 评论 -
JavaScript小汇(10)—— JQuery
文章目录JQuery选择器事件操作DOM操作css显示和隐藏元素windowJQuery公式:$(selector).action()<head> <meta charset="UTF-8"> <title></title> <script src="js/jquery-3.4.1.min.js" type="text/javascript" charset="utf-8"></script></h原创 2021-02-03 09:19:37 · 88 阅读 · 0 评论 -
JavaScript小汇(9)—— 操作表单
文章目录操作表单获值md5加密操作表单获值<form action="#" method="post"> <span>用户名:</span><input type="text" /><br /> <span>性别:</span> <input type="radio" name="gender" id="gender" value="woman" />女 <input原创 2021-02-03 09:19:15 · 80 阅读 · 0 评论 -
JavaScript小汇(8)—— 操作DOM对象
文章目录操作DOM对象重点获得DOM节点操作文本操作css删除节点追加节点 append()已有标签进行追加创建标签进行追加insert操作DOM对象重点浏览器网页就是一个DOM树更新:更新DOM节点遍历:得到DOM节点删除:删除DOM节点添加:添加新节点获得DOM节点</head><body> <div id="d1"> <h1>标题1</h1> <p id="p1">p原创 2021-02-03 09:18:53 · 79 阅读 · 0 评论 -
JavaScript小汇(7)—— 操作BOM对象
文章目录操作BOM对象 重点windowNavigator(不建议使用)screenlocation 重要documenthistory(不建议使用)操作BOM对象 重点BOM浏览器对象模型windowwindow代表浏览器窗口window.innerHeight;>472window.innerWidth;>1536window.outerHeight;>838window.outerWidth;>1550Navigator(不建议使用)Navigat原创 2021-02-03 09:18:26 · 82 阅读 · 0 评论 -
JavaScript小汇(5)——内部对象(Date、JSON)
文章目录内部对象DateJSON内部对象typeof '123';>"string"typeof 123;>"number"typeof NaN;>"number"typeof true;"boolean"typeof undefined;>"undefined"typeof null;>"object"typeof Math.abs;>"function"typeof [];"object"Datevar now = new Da原创 2021-02-03 09:17:57 · 86 阅读 · 0 评论 -
JavaScript小汇(4)——函数、变量作用域、方法
文章目录函数变量作用域方法函数定义function abs(x){ if (x>0) { return x; } else{ return -x; }}abs(20);>20abs(-20);>20var num = function(x){ if (x>0) { return x; } else{ return -x; }}abs(12);&原创 2021-02-02 09:52:04 · 76 阅读 · 0 评论 -
JavaScript小汇(3)——流程控制
文章目录流程控制条件语句循环语句流程控制条件语句if(){}if(){}else{}if(){}else if(){}else{}var score = 79;if (score>80) { console.log("良好");} else if (score>70) { console.log("凑合");}else{ console.log("努力");}循环语句while(){}do{}while(){}var age=0;while原创 2021-02-02 09:51:27 · 70 阅读 · 0 评论 -
JavaScript小汇(2)——数据类型(详述)
文章目录数据类型(详述)字符串数组对象Map和SetMapSet数据类型(详述)字符串请不要把字符串创建为对象,它会拖慢执行速度。new 关键字使代码复杂化。1.用 ‘ ’ “ ”包裹2.注意转义字符\n //新行\'\t\r //回车\u4e2d //unicode\x41 //ascii3.多行字符串编写(用着重号包裹 ``)var s = `hi hello wa`;console.log(s);4.模板字符串var n原创 2021-02-02 09:50:56 · 91 阅读 · 0 评论 -
css知识小汇(5)——定位
文章目录定位相对定位绝对定位固定定位层级和透明度定位相对定位position: relative;(距离右边)right、left、top、bottom相对于元素原来的位置进行定位且元素不会脱离文档流,原位置仍然保留,使元素提升一个层级。 <head> <meta charset="UTF-8"> <title></title> <style type="text/css"> #father{ height:原创 2021-02-02 09:42:35 · 76 阅读 · 0 评论 -
css知识小汇(4)——浮动
文章目录浮动文档流displayfloat清除浮动解决父元素高度塌陷问题浮动文档流文档流处在网页最底层,它表示的是一个页面中的位置,我们所创建的元素都默认在文档流中。块元素:独占一行,自上而下排列 可以设置高度和宽度内联元素:只占自身大小,默认从左向右 设置高度和宽度无效,大小由内容撑开display <head> <!-- 描述:display inline内联元素 block块元素 inline-block既是内联又是块元素 none不原创 2021-02-02 09:42:25 · 196 阅读 · 0 评论 -
css知识小汇(3)——盒子模型
文章目录盒子模型边框内外边距圆角盒子模型margin:外边距border:边框padding:内边距边框 边框粗细 边框颜色 边框样式 <head> <meta charset="UTF-8"> <title></title> <style type="text/css"> *{ margin: 0; padding: 0; } #app{ border: 1px s原创 2021-02-02 09:42:12 · 101 阅读 · 0 评论 -
css知识小汇(2)——页面美化
文章目录页面美化字体样式文本样式超链接伪类阴影列表图标背景渐变页面美化字体样式 font标签中可以按顺序设置如下属性:font-stylefont-variantfont-weightfont-size/line-heightfont-family<head> <meta charset="UTF-8"> <title></title> <style type="text/css"> /*font-fami原创 2021-02-02 09:42:01 · 124 阅读 · 0 评论 -
html知识小汇(3)——视频和音频、iframe内联框架、表单
文章目录视频和音频iframe内联框架表单文本框密码框单选框多选框按钮文件域文本域下拉框验证性提交搜索框滑块表单验证视频和音频controls 控制条autoplay 自动播放<vedio src="" controller autoplay></vedio><audio src="" controller autoplay></audio>iframe内联框架 <iframe src="引用页面地址" name="框架标志名">原创 2021-02-02 09:31:50 · 214 阅读 · 0 评论 -
html知识小汇(2)——行内元素和块元素、列表、表格
文章目录行内元素和块元素行内元素块元素列表有序列表无序列表自定义列表表格行内元素和块元素行内元素内容撑开宽度,左右都是行内元素的可以在一行a 、strong、em…块元素无论内容多少,都独占一行p、h1-h6…列表有序列表<ol> <li></li> <li></li> <li></li></ol>无序列表<ul> <li></l原创 2021-02-02 09:30:20 · 220 阅读 · 0 评论 -
JavaScript小汇(1)——基础数据类型(简述)
文章目录JavaScript基础js引入基本语法数据类型(简述)numberstringbooleannull和undefined逻辑运算符比较运算符 重要!!!数组对象严格检查模式数据类型(详述)字符串数组对象Map和SetMapSet流程控制条件语句循环语句函数变量作用域方法内部对象DateJSON面向对象编程原型对象class操作BOM对象 重点windowNavigator(不建议使用)screenlocation 重要documenthistory(不建议使用)操作DOM对象重点获得DOM节点操作原创 2021-01-17 11:12:42 · 115 阅读 · 0 评论 -
css知识小汇(1)——基本概念、选择器
文章目录css基本概念css优势:css导入的三种方法:选择器基本选择器层次选择器结构伪类选择器属性选择器页面美化字体样式文本样式超链接伪类阴影列表图标背景渐变盒子模型边框内外边距圆角浮动文档流displayfloat清除浮动解决父元素高度塌陷问题定位相对定位绝对定位固定定位层级和透明度css基本概念cascading style sheet 层叠级联样式表css优势: 1.变现与结构相分离 2.网页结构表现统一,可以实现复用 3.样式十分丰富 4.建议使用独立于html的css文件原创 2021-01-13 18:56:11 · 100 阅读 · 0 评论 -
html知识小汇(1)——网页基本信信息、基本标签、图像标签、链接标签
文章目录HTML网页基本信信息网页基本标签图像标签链接标签锚链接功能性链接行内元素和块元素行内元素块元素列表有序列表无序列表自定义列表表格视频和音频iframe内联框架表单文本框密码框单选框多选框按钮文件域文本域下拉框验证性提交搜索框滑块表单验证HTMLw3c标准包括:结构化标准语言(HTML、XML)表现标准语言(CSS)行为语言(DOM、ECMAScript)网页基本信信息<!DOCTYPE html><!-- DOCTYPE告诉浏览器使用什么规范--><原创 2021-01-10 21:36:55 · 117 阅读 · 0 评论