前端相关
前端相关技术记录
weeds606
加速成长……
展开
-
操作cookie
一、操作cookie<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>11-ajax-cookie</title> <script> window.onload = functio...原创 2019-11-28 10:05:30 · 109 阅读 · 0 评论 -
PHP的基本语法
<?phpheader("content-type:text/html;charset=utf-8"); //设置编码?><?php//单行注释////多行注释/**///定义变量$num = 10;//打印内容//后端编写的代码不能直接运行,只能放到服务器对应的文件夹下,通过服务器运行。//如何通过服务器运行:通过ip地址找打服务器对应的文件...原创 2019-11-27 08:52:46 · 135 阅读 · 0 评论 -
ajax学习笔记02-POST的基本使用
一、使用ajax发送post请求<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>07-ajax-post</title> <!-- 1.什么是ajax ajax是与服务器交换数据并更新...原创 2019-11-27 08:51:29 · 491 阅读 · 0 评论 -
ajax学习笔记01-GET的基本使用
一、ajax发送get请求<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>05-ajax-get</title> <!-- 1.什么是ajax ajax是与服务器交换数据并更新部分网页...原创 2019-11-26 09:02:01 · 173 阅读 · 0 评论 -
jQuery学习笔记13-事件冒泡和默认行为
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>jQuery事件冒泡和默认行为</title> <style> *{ margin: 0; ...原创 2019-08-30 09:44:45 · 157 阅读 · 0 评论 -
jQuery学习笔记09-操作CSS
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>jQuery操作样式</title> <script src="jQuery/jquery-1.12.4.js"></script> ...原创 2019-08-28 20:46:32 · 88 阅读 · 0 评论 -
jQuery学习笔记08-文本值相关操作
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>jQuery操作文本值</title> <style> *{ margin: 0; p...原创 2019-08-28 20:31:45 · 86 阅读 · 0 评论 -
jQuery学习笔记07-操作类属性
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>jQuery操作类</title> <style> /*<!--指定class1和class2的样式-->*/ ...原创 2019-08-28 19:52:14 · 76 阅读 · 0 评论 -
jQuery学习笔记06-attr及removeAttr方法的使用
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>jQuery attr方法</title> <script src="jQuery/jquery-1.12.4.js"></script>...原创 2019-08-28 09:16:57 · 211 阅读 · 0 评论 -
jQuery学习笔记05-内容选择器
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>jQuery内容选择器</title> <style> div{ width: 50px; ...原创 2019-08-28 08:28:08 · 108 阅读 · 0 评论 -
jQuery学习笔记04-常用的静态方法
1.each方法作用:用于遍历数组或对象,并将遍历的数组或对象返回语法:$.each(object,回调函数)<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>each方法</title> <s...原创 2019-08-27 09:09:17 · 95 阅读 · 0 评论 -
jQuery学习笔记10-尺寸和位置设置
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>jQuery尺寸和位置</title> <style> .father{ width: 200px; ...原创 2019-08-29 08:57:27 · 128 阅读 · 0 评论 -
jQuery学习笔记11-scrollTop使用
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <style> *{ margin: 0; padding...原创 2019-08-29 09:23:47 · 142 阅读 · 0 评论 -
jQuery学习笔记12-绑定及解绑事件
一、绑定事件<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>jQuery事件绑定</title> <script src="jQuery/jquery-1.12.4.js"></scri...原创 2019-08-30 08:47:12 · 124 阅读 · 1 评论 -
jQuery学习笔记14-事件自动触发、自定义事件
一、事件自动触发<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>jQuery事件自动触发</title> <style> *{ margin: 0; ...原创 2019-08-31 08:39:14 · 197 阅读 · 0 评论 -
jQuery学习笔记15-事件委托
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>jQuery事件委托</title> <script src="jQuery/jquery-1.12.4.js"></script> ...原创 2019-08-31 09:59:28 · 119 阅读 · 0 评论 -
jQuery学习笔记16-移入移出事件
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>jQuery移入移出事件</title> <style> *{ margin: 0; ...原创 2019-09-02 08:46:30 · 150 阅读 · 0 评论 -
bootstrap学习笔记01-栅格系统
一、bootstrap的安装1.在bootstrap官网下载安装包bootstrap官网。2.解压安装包,解压后将jQuery的包放在js目录下。注意:jQuery的包需要另外下载3.在HTML代码中引用第三方包 <!--引入bootstrap的css样式--> <link rel="stylesheet" href="bs/css/boots...原创 2019-09-16 20:13:29 · 225 阅读 · 0 评论 -
bootstrap学习笔记02-公共样式
1.文字颜色.text-success:成功绿.text-danger:危险红具体样式参考:字体颜色代码示例:<!--字体添加样式--><p class="text-success">.text-success</p><p class="text-danger">.text-danger</p>2.背景颜色...原创 2019-09-17 20:04:11 · 466 阅读 · 0 评论 -
bootstrap学习笔记03-组件
一、什么是组件组件就是对特定功能的封装。二、常用组件1.警告提示框详情请点击代码示例:<!--不可关闭的提示框组件--><div class="alert alert-success" role="alert">不可关闭的提示框</div><!--可关闭的提示框组件--><div class="alert a...原创 2019-09-19 09:38:40 · 710 阅读 · 0 评论 -
jQuery学习笔记03-静态方法和实例方法
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>静态方法和实例方法</title> <script src="jQuery/jquery-1.12.4.js"></script> ...原创 2019-08-26 20:48:23 · 88 阅读 · 0 评论 -
jQuery学习笔记02-核心函数
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>jQuery核心函数</title> <script src="jQuery/jquery-1.12.4.js"></script> ...原创 2019-08-26 20:09:58 · 103 阅读 · 0 评论 -
HTML学习笔记12-HTML列表
一、HTML无序列表1.HTML无序列表使用<ul>标签进行定义,列表项使用<li>标签进行定义。列表项内部可以使用段落、换行符、链接、其他列表。具体代码如下<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title...原创 2019-08-09 09:25:50 · 244 阅读 · 0 评论 -
HTML学习笔记4-HTML属性
一、HTML属性1.HTML标签可以定义属性2.属性定义在开始标签中3.属性总是以键值(key="value")对的形式出现。4.属性值始终要包含在双引号内二、属性实例<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <titl...原创 2019-08-06 08:58:37 · 86 阅读 · 0 评论 -
HTML学习笔记3-HTML元素
一、什么是HTML元素HTML元素指的是从开始标签到结束标签的所有代码。比如:<body> <img src="1.jpg" width="915" height="585"> </body>二、HTML元素的语法1.HTML元素以开始标签起始,以结束标签终止。2.元素的内容是开始标签与结束标签之前的内容3.某些HTML元素具有空内容,空元素...原创 2019-08-06 08:36:04 · 137 阅读 · 0 评论 -
HTML学习笔记2-HTML标签
本次介绍四个基础的HTML标签一、HTML标题HTML标题是通过<h1>-<h6>这6个标签进行定义的。具体练习代码如下:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>标题标签练习</t...原创 2019-08-05 20:57:45 · 97 阅读 · 0 评论 -
HTML学习笔记1-HTML简介
一、实例解析,代码如下<!DOCTYPE html><html><head><meta charset="utf-8"><title>HTML学习笔记</title></head><body><h1>我是一个标题</h1><p>我是一个段落&...原创 2019-08-05 20:18:42 · 76 阅读 · 0 评论 -
HTML学习笔记11-HTML表格
一、HTML表格定义1.<table>标签定义表格2.<tr>标签定义表格的行3.<td>标签定义单元格接下来创建一个简单表格,具体代码如下:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <t...原创 2019-08-08 09:53:00 · 257 阅读 · 0 评论 -
HTML学习笔记10-HTML图像
一、HTML图像图像使用<img>标签定义,该标签为空标签,只有开始标签,没有结束标签。该标签生成的元素只有属性没有内容。实现显示图片的两种方式1.1.显示本地的图片,图片1.jpg和该html文档在同一目录。具体代码如下:<!DOCTYPE html><html lang="en"><head> <meta char...原创 2019-08-08 09:13:09 · 202 阅读 · 0 评论 -
HTML学习笔记9-HTML链接
一、链接的定义使用<a>标签定义链接,a标签的内容是需要展示给用户的信息。可以是文字也可以是图片1.1.点击文字进行链接跳转,具体定义方法如下:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>链接标签练习&...原创 2019-08-08 08:48:49 · 292 阅读 · 0 评论 -
HTML学习笔记5-HTML标题
一、HTML标题1.HTML标题是通过<h1>-<h6>标签定义2.<h1>最大,<h6>最小注意:编写HTML文件时,必须要确保<h1>-<h6>标签只能用于标题,不仅仅是因为字体加粗及变大的原因。浏览器会根据文件的标题及内容,设置索引。实例<!DOCTYPE html><html ...原创 2019-08-07 08:33:54 · 158 阅读 · 0 评论 -
HTML学习笔记6-HTML段落
一、HTML段落HTML段落是通过<p>标签定义的,具体代码如下<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>段落标签练习</title></head><body>...原创 2019-08-07 08:43:56 · 112 阅读 · 0 评论 -
jQuery学习笔记01-入口函数的四种写法
<script> // <!--第一种写法--> $(document).ready(function () { alert("测试001"); }); //第二种写法 jQuery(document).ready(function () { ...原创 2019-08-26 19:22:32 · 143 阅读 · 0 评论 -
CSS学习笔记3-CSS三大特性
一、什么是CSS的三大特性CSS的三大特性包括继承性、层叠性、优先级二、继承性给父元素设置属性后,后代元素也可以使用该属性。注意:不是所有属性都可以继承,只有以font-、color、size-、line开头的属性才能被继承。如下所示,在CSS中将div标签的文本颜色设置为红色,div标签的后代标签的文本颜色都为红色<!DOCTYPE html><html...原创 2019-08-22 15:46:01 · 241 阅读 · 0 评论 -
CSS学习笔记2-CSS选择器
一、CSS选择器1.什么是CSS选择器2.CSS选择器的作用根据指定标签,在当前页面中,找到所有符合条件的标签,设置样式3.选择器需要的注意点选择器选中的是所有该类型的标签,不是一部分,是所有。无论标签藏得多深,选择器都可以找到该标签二、常见的CSS选择器1.标签选择器作用:在整个页面中,选择包含该标签的所有元素,设置属性需求:将页面中所有的p标签内容设...原创 2019-08-22 10:31:48 · 148 阅读 · 0 评论 -
CSS学习笔记1-CSS属性
一、什么是CSS属性用下图来解释一下什么是CSS属性二、CSS常见属性1.文字属性1.1 font-style作用:用于规定文字样式语法:标签名{ /*italic:斜体、normal:正常*/ font-style: normal; }1.2 font-weight作用:定义文字的粗细语...原创 2019-08-20 20:46:14 · 103 阅读 · 0 评论 -
JavaScript学习笔记02-常量及变量
一、什么是常量常量为一些不会变化的数据,常见的常量有:整型常量、实型常量、字符串常量、布尔值、特殊字符。二、变量1、什么是变量发生变化的一些数据。如a=1,此时a就是变量,1就是常量,因为a可以等于1,也可以等于其他值。2、如何定义变量定义单个变量格式:var 变量1;var num1;定义多个变量格式:var 变量1, 变量2, 变量3;var num1,...原创 2019-08-24 09:51:37 · 149 阅读 · 0 评论 -
JavaScript学习笔记01-基础概念
一、什么是JavaScriptJavaScript是一门前端的脚本语言(解释性语言),简称js二、js在前端中的作用js用于控制页面的行为。三、js的三种书写格式1.行内式将js代码写在标签的属性中。如下:<div onclick="alert('hello world')">我是div</div>2.内嵌式将js代码写在body中。如...原创 2019-08-24 09:31:44 · 70 阅读 · 0 评论 -
HTML学习笔记8-HTML文本格式化
一、常见的文本格式化标签标签 描述 <b> 定义加粗文本 <em> 定义着重文字 <i> 定义斜体字 <small> 定义小号字 <strong> 定义加重语气 <sub> 定义下标字 <sup> 定义上标字 <ins>...原创 2019-08-07 20:45:11 · 155 阅读 · 0 评论 -
HTML学习笔记13-HTML表单
一、什么是表单(form)用于收集用户信息二、什么是表单元素表单元素指的是不同类型的input元素。输入框、单选框、复选框、按钮等三、input标签的常见类型1.输入框1.1 type="text"作用:用于输入明文信息语法:<form> 明文输入框:<input type="text"></form>1.2 ...原创 2019-08-19 19:39:55 · 205 阅读 · 0 评论