前端开发
文章平均质量分 76
huangql517
这个作者很懒,什么都没留下…
展开
-
CSS学习之css介绍和引入
1>引子 如之前的html,当我们想要修改html元素的样式的时候,需要为每个html标签添加属性,当html内容非常多时, 会重复定义很多相同属性(例如不同标签拥有相当属性,需在每个标签内单独定义),修改也需逐个修改,后期 极难维护,所以,css出现了。2>css概念 层叠样式表(Cascading Style Sheets),样式定义如何显示html元素,样...原创 2018-05-17 10:20:42 · 278 阅读 · 1 评论 -
JS学习之DOM及案例
1>DOM简介 当网页被加载时,浏览器会创建页面的文档对象模型(Document Object Model,简称DOM)。 即当浏览器载入HTML文档时, 它就会成为DOM对象,而在JS中,所有的事物都是节点, 元素、文本等都是节点。可以通过节点进行DOM对象的增删改查。 既然HTML在被浏览器加载时会对应的生成DOM对象,而JS又可以通过节点来操作DOM,所以,JS...原创 2018-05-28 12:05:11 · 2018 阅读 · 0 评论 -
JS学习之流程控制
1>if.. 、if..else..、if..else if..else 语法: ---> if(条件){执行代码} ---> if(条件){执行代码1}else{执行代码2} ---> if(条件1){执行代码1}else if(条件2){执行代码2}else{执行代码3} 2>逻辑与 && 和逻辑或 ||,(类似pyt...原创 2018-05-24 10:43:59 · 504 阅读 · 0 评论 -
jQuery引入和各种选择器
1>引子 jQuery官网介绍:write less,do more jQuery是javascript的一个库,包含多个可重用的函数,用来辅助我们简化javascript开发。2>先看下引入jQuery <!--可以引入百度的jQuery库--><script src="http://libs.baidu.com/jquery/2.0.0/jqu...原创 2018-06-05 10:44:56 · 305 阅读 · 0 评论 -
jquery之html属性和dom属性操作
1>html属性修改attr设置属性值或者 返回被选元素的属性值removeAttr从每一个匹配的元素中删除一个属性propprop()获取在匹配的元素集中的第一个元素的属性值.它是对当前匹配到的dom对象设置属性。removeProp用来删除由.prop()方法设置的属性集addClass(添加多个类名)为每个匹配的元素添加指定的类名。removeClass从所有匹配的元素中删除全部或者指...原创 2018-06-12 15:12:31 · 201 阅读 · 0 评论 -
jQuery对象转换和显示效果
1>jquery对象和DOM对象的转换 <script src="jquery-3.3.1.min.js"></script> <script type="text/javascript">// DOM对象转换成jquery对象var oDiv = document.getElementById('box');console.log($(oD...原创 2018-06-06 13:58:17 · 306 阅读 · 0 评论 -
JS学习之DOM案例二
包括如下一些案例:留言板效果,页签分页效果,输入框隐性提示,获取最新时间和 广告自动关闭效果。1>留言板效果 思路:首先有个输入框,提交按钮,这些html搞定,当输入框输入内容,点击提交的时候,这时会触发一些事件: 取到文本框的内容(value属性的值),把内容插入到文本框前面(通过js创建dom元素,文本insertHTML或者 insertText方式插入), ...原创 2018-05-30 11:04:49 · 360 阅读 · 0 评论 -
JS学习之BOM
1>什么BOM BOM,Browser Object Model,浏览器对象模型,我们之前说的DOM,核心是文本Document 同理,DOM的核心是浏览器,接下来就介绍下浏览器的一些常用对象和方法 其实我们之前就有接触过BOM了,如 alter(),console.log()等2>一些常用的方法,prompt,confirm,print,findprompt('AA...原创 2018-06-01 13:40:47 · 152 阅读 · 0 评论 -
jquery元素筛选和事件
1>元素筛选方法 $(function(){ //jquery的遍历方法 .each() $('ul').children().each(function(index,ele){ console.log(index); console.log(ele); va...原创 2018-06-20 15:29:19 · 353 阅读 · 0 评论 -
JS学习之定时器和正则
1>定时器函数 1.1>setInterval() :按照指定的周期(以毫秒计)来调用函数或计算表达式。方法会不停地调用函数, 直到 clearInterval() 被调用或窗口被关闭。 语法:setInterval(code,millisec,lang) code:要调用的函数或要执行的代码串。millisec:周期性执行或调用...原创 2018-05-28 10:10:36 · 365 阅读 · 0 评论 -
JS学习之引入,变量和数据类型
1>引子 JavaScript是什么 javaScript是一种web前端的描述语言,也是一种基于对象(object)和事件驱动(Event Driven)的、 安全性好的脚本语言。 它运行在客户端从而减轻服务器的负担。 为什么要引入javascript? 如果把网页比作一个人的话,人的本体就是HTML(网页的实质性内容都在HTML里面),穿的衣服就是CS...原创 2018-05-23 14:57:31 · 291 阅读 · 0 评论 -
CSS学习之基础选择器和高级选择器
1>什么是选择器 一个HTML页面中有很多的元素,不同的元素可能会有不同的样式,有些元素又需要设置相同的样式, 选择器就是用来从HTML页面中查找特定一个或一组元素,找到之后就可以为它们设置样式了。 选择器为样式规则指定一个作用范围。 基础选择器包括:标签选择器类选择器ID选择器通用选择器2>基础选择器的用法 2.1>标签选择器---故名思议,通过...原创 2018-05-17 11:31:19 · 427 阅读 · 0 评论 -
CSS学习之伪类选择器及文字/文本/背景属性
1>伪类选择器 常用的连接有 link,visited,hover,active,input有focus 2>伪元素选择器 查看元素,有一些 ::before和 ::after之类的,这些就是伪元素选择器了 3>字体属性 font-family:字体系列 font-weight:字体粗细 font-size...原创 2018-05-18 15:33:24 · 902 阅读 · 0 评论 -
CSS学习之盒模型
1>盒模型的border 如下,设置各种边框的宽度,颜色,类型 可以简写如下/*四个值:上 右 下 左 顺时针*/ /*三个值: 上 左右 下*/ /*两个值: 上下。左右*/ /*一个值: 四个方向*/border-style: solid; 如上说明,一个值就四个方向,2个值就对应上下和左右方向, 通常我们会这样写:b...原创 2018-05-18 17:14:17 · 131 阅读 · 0 评论 -
JS学习之引用数据类型
1>数组 Array,类似于python的List,很多属性或方法甚至一样, 创建,取值,写入合并,转换字符串,拼接,查找下标,排序,反转,增加,移除元素2>3>4>...原创 2018-05-25 10:05:15 · 773 阅读 · 0 评论 -
JS学习之函数和创建对象的方法
1>函数,由事件驱动或主动调用的,可重复执行的代码块 --->函数调用形式 如下,用function直接先声明(函数),后调用,是最常见,也是最好理解的一种形式。 --->或者如下形式,var声明 --->函数带参数 --->函数带参且有返回值 2>创建对象的方式 2.1>使用Obj...原创 2018-05-25 11:40:36 · 187 阅读 · 0 评论 -
CSS学习之display属性与浮动
1>display display属性主要是用来 控制HTML元素的显示和隐藏 与 块级元素与行内元素的转换的 display的值,如下 --> block(块级元素 ) block元素通常被现实为独立的一块,独占一行,多个block元素会各自新起一行,默认block 元素宽度自动填满其父元素宽度。block元素可以设置width、heig...原创 2018-05-22 14:00:53 · 1346 阅读 · 0 评论 -
HTML学习一
1>原创 2018-05-16 10:51:47 · 190 阅读 · 0 评论 -
HTML学习二
1>表格表单是一个包含表单元素的区域表单元素是允许用户在表单中输入内容,比如:文本域(textarea)、输入框(input)、单选框(radio)表单中的属性如下--->aciton:定义表单被提交时发生的动作,提交给服务器处理程序的地址,--->method:定义表单提交数据的方式吗,包括get和post,--->enctype:编码类型,影响表单提交给服务器的数据类型...原创 2018-05-17 09:24:10 · 172 阅读 · 0 评论 -
CSS学习之相对定位和绝对定位
1>位置属性position position的值包括 relative(相对定位)、 absolute(绝对定位)、fixed(固定位置)、 static 等 不设置时默认就是static。 设置定位之后,top、left、right、bottom属性值可以使用。2>相对位置 相对于自身进行定位 1>不设置偏移量的时候 ...原创 2018-05-23 09:59:09 · 11908 阅读 · 8 评论 -
前端开发之抽屉热搜榜
<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title>抽屉新热榜</title> <style type="text/css">原创 2018-06-28 18:10:28 · 1245 阅读 · 0 评论