H5+C3+JS
关注
分享
扫一扫
文章平均质量分 86
H5+C3+JS
万里顾—程
我变得自信有趣，
允许别人踏入我的生活；
我睡的越来越早，
开始在乎前途和未来，
我知道那个我回来了！
展开
-
JavaScript——操作表单（MD5验证）
文章目录获取值,设置值表单验证(MD5验证)用JavaScript来操作表单，可以获得用户输入的内容，或者对一个输入框设置新的内容。HTML表单主要的输入控件文本框 text下拉框 < select >单选框 radio多选框 checkbox隐藏域 hidden密码框 password表单的目的：提交信息获取值,设置值获得了一个节点的引用，就可以直接调用value获得对应的用户输入值<form action="psot"><p>原创 2021-01-02 22:43:24 · 1648 阅读 · 5 评论 -
JavaScript——方法的定义和调用
JavaScript——方法的定义和调用文章目录JavaScript——方法的定义和调用方法的定义和调用apply方法方法的定义和调用把函数放到对象里就变成了方法(一个对象里只有属性和方法)var shenming={ //属性，用逗号隔开 name:'神明', birth:2000, //方法 把函数写在对象里面就是方法 age:function(){//函数绑定在对象shenming上，可以做很多事情，比如得到对原创 2020-12-19 20:39:48 · 266 阅读 · 3 评论 -
JavaScript——JS的引入方式
JavaScript——我的第一个JavaScript程序以及JS的引入方式初识JavaScriptJavaScript（简称JS）是一种属于网络的高级脚本语言,已经被广泛用于Web应用开发,常用来为网页添加各式各样的动态功能,为用户提供更流畅美观的浏览效果。通常JavaScript脚本是通过嵌入在HTML中来实现自身的功能的我的第一个JS程序<!DOCTYPE html><html lang="en"><head> <meta charset=原创 2020-12-03 21:31:05 · 1878 阅读 · 0 评论 -
JavaScript——函数定义和参数问题
JavaScript——函数定义和参数获取函数的定义函数就是包裹在花括号中的代码块，前面使用了关键词 function函数声明后不会立即执行，会在我们需要的时候调用到。定义方式一：function functionname(){ // 执行代码}测试：绝对值函数function abs(x){ if(x>=0){ return x; }else{ return -x;原创 2020-12-09 20:57:30 · 405 阅读 · 0 评论 -
JavaScript——严格检查模式Strict的使用
JavaScript——严格检查模式Strictuse strict:严格检查模式，预防js的随意性带来的问题不使用use strict的时候<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <script> //全局变量 局部变量，最好用let表示原创 2020-12-05 12:49:03 · 238 阅读 · 2 评论 -
学习HTML DOM对象，这一篇就够了
文章目录什么是DOMDOM节点获取DOM节点更新DOM节点删除DOM节点插入DOM节点方法一appendChild()方法二insertBefore()什么是DOMDOM（ Document Object Model）：文档对象模型HTML DOM - 针对 HTML 文档的标准模型HTML DOM 定义了所有 HTML 元素的对象和属性，以及访问它们的方法。换言之，HTML DOM 是关于如何获取、修改、添加或删除 HTML 元素的标准DOM节点根据 W3C 的 HTML DOM 标准，原创 2020-12-27 21:40:23 · 359 阅读 · 0 评论 -
JavaScript——内部对象(Date,JSON)
JavaScript——内部对象(Date,JSON)标准对象//返回对象类型typeof 123"number"//数字typeof '神明'"string"//字符串typeof true"boolean"//布尔值typeof NaN"number"typeof Math"object" //objecttypeof Math.abs"function"//函数typeof [1,2,3]"object"typeof undefined"undefined"//原创 2020-12-20 16:15:10 · 225 阅读 · 1 评论 -
JavaScript——jQuery详解
文章目录什么是jQueryjQuery下载jQuery引入jQuery选择器基本选择器jQuery事件鼠标事件键盘事件其他事件解除绑定操作DOM元素获取Text文本和html文本设置Text纯文本和html文本修改CSS样式元素的显示和隐藏获取DOM信息操作DOM属性attr() 方法设置或返回被选元素的属性值。removeAttr() 方法从被选元素中移除属性。操作表单修改DOM结构添加DOM删除DOM节点删除节点什么是jQueryjQuery是一个JavaScript函数库。jQuery是一个原创 2021-01-16 21:42:31 · 602 阅读 · 2 评论 -
JavaScript——js数据类型详解
JavaScript——数据类型详解文章目录JavaScript——数据类型详解字符串类型数组类型对象类型流程控制类型字符串类型正常字符串用单引号或者双引号console.log('a')console.log("神明") 转义字符串要在前面加\console.log('ab\'c\'d') //ab'c'dconsole.log('a\nb') // \n换行符console.log('a\tb') // \t空格符 console.log("\u4e2原创 2020-12-08 20:50:18 · 410 阅读 · 0 评论 -
JavaScript——ES6新特性Map,Set和for...of循环
JavaScript——ES6新特性Map与SetMap对象Map 对象保存键值对。任何值(对象或者原始值) 都可以作为一个键或一个值。//Map的定义和打印var map=new Map([["张三",100],["李四,90],["王五",80]]); var name=map.get("张三"); console.log(name);//通过Key获得value//Map的添加和删除 map.set("神明",70); //添加原创 2020-12-08 22:13:38 · 558 阅读 · 0 评论 -
JavaScript——数据类型简述
JavaScript——数据类型概述变量varvar 变量名 = 变量值、、/*规范：变量名不能以数字，#开头 可以包含$,_等特殊字符以及中文 */ Number在js里面，不区分小数，整数，都是用Number表示123 //整数123123.1 //浮点数1.122e3 //科学计数法-88 //负数 NaN //不是一个数字Infinity//表示无限大 字符串'abc'"abcd""/n" //转义字符 布尔值tr原创 2020-12-05 11:23:39 · 230 阅读 · 1 评论 -
JavaScript——操作BOM对象
JavaScript——操作BOM对象BOM：浏览器对象模型windows对象Window 对象表示浏览器中打开的窗口 ，Window 对象还实现了核心 JavaScript 所定义的所有全局属性和方法window对象使用window.alert("跨年晚会")undefinedwindow.innerHeight 窗口内高137window.innerWidth 窗口内宽1360window.outerHeight 窗口外高768window.outerWidth 窗口外宽原创 2020-12-25 20:51:09 · 150 阅读 · 0 评论 -
JavaScript——面向对象编程之继承
JavaScript——面向对象编程之继承文章目录JavaScript——面向对象编程之继承原型继承（Es6之前）class继承（Es6新特性）原型链原型继承（Es6之前）原型对象（类）对象：具体实例var student = { name : "shenming", age : 3, sex : '男', run:function(){ console.log(this.name +"快跑"); }};var xiaomimg = { name : "t原创 2020-12-24 21:45:49 · 174 阅读 · 1 评论 -
JavaScript——变量作用域(全局作用域和局部作用域)
JavaScript——变量作用域在js中，var定义的变量实际是有作用域的，假设在函数体中声明，则在函数体外不可使用（如果要使用，可以用闭包）测试：function text(){ var i = 1; i = i+1;}i = i+2;//报错：Uncaught ReferenceError: i is not defined两个函数可以使用相同的变量名，只要在函数内部，就不会冲突 function text(){ var i = 1原创 2020-12-18 17:18:24 · 5933 阅读 · 2 评论 -
JavaScript——基本语法入门及控制台打印变量
JavaScript——基本语法入门及控制台打印变量基本语法1.变量语法2.条件控制语法<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <script> // 1.变量语法 格式：变量类型 变量名 = 变量值 //在js这个随意的语言里面，所原创 2020-12-05 10:04:02 · 4201 阅读 · 1 评论 -
CSS——属性选择器的学习
CSS——属性选择器属性选择器可以根据元素的属性及属性值来选择元素，相当于把class选择器和id选择器结合，功能更强大。属性选择器的测试<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <style> .demo a{ float:lef原创 2020-11-08 14:09:19 · 244 阅读 · 1 评论 -
CSS——介绍结构伪类选择器
CSS——结构伪类选择器结构伪类选择器，可以根据元素在文档中所处的位置，来动态选择元素，从而减少HTML文档对ID或类的依赖，有助于保持代码干净整洁。结构伪类选择器的测试<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <style> ul li:first-ch原创 2020-11-20 09:29:16 · 380 阅读 · 2 评论 -
css——css的三种导入方式
css——css的三种导入方式行内样式内部样式外部样式三种导入方式的测试<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title><!--2.内部样式--> <style> h1{ color:green; } &原创 2020-11-05 19:06:28 · 249 阅读 · 1 评论 -
CSS——超链接伪类和文本阴影
CSS——超链接伪类和文本阴影伪类CSS伪类是用来添加一些选择器的特殊效果。解释：在感觉上伪类可以是动态的，当用户和文档进行交互的时候一个元素可以获取或者失去一个伪类。例外的是":first-child"能通过文档树推断出来，":lang"在一些情况下也在从文档树中推断出来。由此可以看出，它的功能和class有些类似，但它是基于文档之外的抽象，所以叫伪类。伪类有：:first-child ，:link ,:vistited，:hover，:active ,:focus，:lang，:right，原创 2020-11-20 10:36:31 · 434 阅读 · 0 评论 -
CSS——盒子模型及内外边距
CSS——盒子模型及内外边距什么是盒子模型（Box Model）所有HTML元素可以看作盒子，在CSS中，"box model"这一术语是用来设计和布局时使用。CSS盒模型本质上是一个盒子，封装周围的HTML元素，它包括：边距，边框，填充，和实际内容。盒模型允许我们在其它元素和周围元素边框之间的空间放置元素。下面的图片说明了盒子模型(Box Model)：不同部分的说明：Margin(外边距) - 清除边框外的区域，外边距是透明的。Border(边框) - 围绕在内边距和内容外的边框。原创 2020-11-25 18:02:50 · 1362 阅读 · 2 评论 -
CSS——背景图像应用及渐变
CSS——背景图像应用及渐变背景图片 div{ width:1000px; height:700px; border:2px solid red; /*边框：粗细 实线 颜色*/ background-image:url("images/11-20.jpg"); /*图片在边框内默认平铺*/ } /*平铺方式*/ .div1{ backgr原创 2020-11-20 17:27:18 · 266 阅读 · 0 评论 -
CSS——层次选择器
文章目录后代选择器子选择器兄弟选择器通用选择器后代选择器选择某个元素后面所有的标签<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <style> /*后代选择器*/ body p{ background:pink; }原创 2020-11-06 14:17:25 · 216 阅读 · 0 评论 -
CSS——CSS文本样式
CSS——文本样式颜色 agb/agba文本对齐 text-align:left,center,right首行缩进 text-indent行高 line-height 让行高（文字在文本框里的高度）和文本高相同，则文字居中装饰 text-decoration 下，中，上划线文本图片水平对齐 vertical-align:middle文本样式测试<!DOCTYPE html><html lang="en"><head> &l原创 2020-11-09 09:44:51 · 317 阅读 · 1 评论 -
CSS——定位，z-index和透明度
CSS——定位，z-index和透明度CSS 定位 (Position) 属性允许你对元素进行定位。static默认。位置设置为 static 的元素，它始终会处于页面流给予的位置（static 元素会忽略任何 top、bottom、left 或 right 声明）。relative位置被设置为 relative 的元素，可将其移至相对于其正常位置的地方，因此 “left:20” 会将元素移至元素正常位置左边 20 个像素的位置。absolute位置设置为 absolute原创 2020-12-01 20:48:19 · 610 阅读 · 0 评论 -
CSS——CSS常用的字体样式
CSS——字体样式常用：font-family：字体font-size：大小font-weight：粗细color：颜色字体样式测试<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <style> body{ font-family:楷原创 2020-11-08 19:54:56 · 15634 阅读 · 0 评论 -
CSS——圆角边框和阴影
CSS——圆角边框和阴影圆角边框<!DOCTYPE html><html lang="en"><bead> <meta charset="UTF-8"> <title>Title</title> <style> div{ width:400px; height:400px; border:10px solid #00d原创 2020-11-27 15:06:20 · 554 阅读 · 0 评论 -
CSS——三种基本选择器
CSS——三种基本选择器选择器作用：选择页面上的某一个或者某一类元素基本选择器1.标签选择器<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <style> /*标签选择器会选择到页面上所有的这个标签的元素*/ h1{ colo原创 2020-11-05 20:29:27 · 626 阅读 · 0 评论 -
CSS——我的第一个css程序
CSS——我的第一个css程序CSS简介css：层叠样式表（Cascading Style Sheets）css可以用来为网页创建样式表，通过样式表可以对网页进行装饰所谓层叠，可一将整个网页想象成是一层一层的结构，层次高的将会覆盖层次低的而css就可以分别为网页的各个层次设置样式我的第一个css程序方式一.把css代码写在html(头部)里<!DOCTYPE html><html lang="en"><head> <meta char原创 2020-11-05 10:20:03 · 506 阅读 · 1 评论 -
CSS——列表样式的使用
css——列表样式列表样式练习<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>列表样式</title> <link href="css/style.css" rel="stylesheet" type="text/css"></head><body><div id="n原创 2020-11-20 15:45:18 · 427 阅读 · 0 评论 -
CSS——display和浮动以及解决浮动中父级边框塌陷的问题
CSS——display和浮动文章目录CSS——display和浮动display浮动（float）解决浮动中父级边框塌陷的问题方法一：增加父级边框的高度**方法二：增加一个空的div标签，清除浮动**方法三：在父级元素中使用overflow-hidden（简单）**方法四：父类添加一个伪类：after(推荐使用)**display和float的对比displaydisplay 属性规定元素应该生成的框的类型。display可能的值none此元素不会被显示。block此元素原创 2020-11-28 22:26:53 · 494 阅读 · 0 评论 -
HTML5——我的第一个HTML网页
HTML5——我的第一个网页HTML（Hyper Text Markup Language）：超文本标记语言超文本包括：文字，图片，音频，视频，动画等W3C标准W3C（World Wide Web Consortium万维网联盟）标准结构化标准语言（HTML，XML）表现标准语言（CSS）行为标准（DOM，ECAMAScript）写第一个HTML网页1.在项目下创建一个目录（html）2.在创建的目录下建一个HTML文件3.创建后会自动生成html文件4.点击右上角的浏览器原创 2020-10-27 22:01:27 · 1447 阅读 · 2 评论 -
HTML5——网页的基本信息
HTML5——网页基本信息<!--注释的写法，快捷键CTRL+/--><!--DOCTYPE作用：告诉浏览器我们要使用什么规范 ，不写默认也是html--><!DOCTYPE html><!--向搜索引擎表示该页面是html语言，并且语言为英文，其"lang"的意思就是“language”，而“en”即表示english，你的网页如果是中文网页，可将其改为 <html lang="zh"> --><html lang="en"&原创 2020-10-28 09:04:41 · 413 阅读 · 1 评论 -
HTML5——添加媒体文件
HTML5——添加视频和音频把要添加的视频和音频放到资源目录下视频video 音频audiosrc：资源路径controls：控制条autoplay：自动播放<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>媒体元素</title></head><body><audio src="原创 2020-10-30 20:38:33 · 330 阅读 · 0 评论 -
HTML5——设计一个表单
HTML5——设计一个表单post和get提交 get方式提交：提交后可以在url中看到我们填写的信息（账号，密码等），会不安全，但是高效，不能传输大文件 post方式提交：不能看到我们填写的信息，比较安全，也可以传输大文件要素文本框单选框和多选框按钮文本域和文件域搜索滑框和简单验证初级验证<!DOCTYPE html><html lang="en"><head> <meta c原创 2020-11-02 17:43:29 · 4088 阅读 · 0 评论 -
HTML5——网页基本标签
文章目录HTML5——网页的基本标签基本标签：图像标签链接标签行内元素和块元素列表标签表格标签HTML5——网页的基本标签基本标签：标题标签 段落标签换行标签水平线标签字体样式标签粗体：<strong></strong>斜体：<em></em>注释和特殊符号空 格> >大于< <小于基本标签的使用<!DOCTYPE html>原创 2020-10-30 16:49:59 · 1288 阅读 · 0 评论