A股上市公司传智教育(股票代码 003032)旗下技术交流社区北京昌平校区

 找回密码
 加入黑马

QQ登录

只需一步,快速开始

© xiaoMaoLv 初级黑马   /  2018-1-23 16:25  /  885 人查看  /  0 人回复  /   1 人收藏 转载请遵从CC协议 禁止商业使用本文

本帖最后由 小石姐姐 于 2018-1-24 15:03 编辑

day01
一.HTML基本

1.概述:超文本标记语言

2.作用:html是用来制作页面的(静态页面)

3.使用:扩展名为.html或者.htm的文件

4.结构标签:

<html></html>

<head></head> 标签头

<body></body> 标签体

二.html几种基本的标签

1.<font></font> 字体标签

属性:color 颜色

size 字体的大小

face:字体

2.<h1>...<h6> 标题标签 大小从小到大

3.<p></p> 段落标签

4.<b></b> 加粗标签

5.<i></i> 斜体标签

6.<u></u> 下划线标签

7.<center></center>居中标签

三.HTML有标准:

1. HTML4

    * <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

2.HTML5:支持视频播放,支持CSS3,支持定位,扩展标签...

    * <!DOCTYPE html>

3.<hr/>

四.常用的标签

1) 图片标签 <img>

src:图片的路径

width:图片的宽度

height:图片的高度

alt :图片找不到显示的内容

图片的引入路径:

如果使用相对路径(../代表上一级)(../../代表上上一级)

2) 有序列表 <ol></ol>

使用:  <ol>

<li></li>

</ol>

3) 无序列表 <ul></ul>

使用: <ul>

<li></li>

</ul>

4) html超链接 <a></a>

属性:

href:链接的路径

target: 打开的方式

a. _self :在自身页面打开

b. _blank:新窗口打开

五.table标签

<table></table> *表格标签

<tr>  *行

<td></td>  *列

</tr>

属性:

width:宽度

height:高度

border:边框

align:表格的水平位置

*left 居左

*center 居中

* right 居右

td的属性:

colspan="列数"

rowspan="行数"



六.form标签

<form>

action:提交的路径

method:请求方式,默认是get

区别:

get:数据会显示到地址栏中,get提交的方式有大小的限制

post: 数据不会显示到地址栏中,post 无提交大小的限制

* <input type=”text”>      :文本框.

    * 常用属性:

        * name   :表单元素的名称.必须有name属性,然后后台才可以接收数据.

        * value  :文本框的默认值.

        * size   :文本框的长度.

        * maxlength:文本框输入的最大长度.

        * readonly:只读文本框.

* <input type=”password”>  :密码框.

    * 常用属性:

        * name   :表单元素的名称.必须有name属性,然后后台才可以接收数据.

        * value  :密码框的默认值.

        * size   :密码框的长度.

        * maxlength:密码框输入的最大长度.



* <input type=”radio”>     :单选按钮.

    * 常用的属性:

        * name   :表单元素的名称.必须有name属性,然后后台才可以接收数据.

        * value  :单选按钮的默认值.

        * checked:单选按钮默认被选中.


* <input type=”checkbox”>  :复选按钮.

* 常用的属性:

        * name   :表单元素的名称.必须有name属性,然后后台才可以接收数据.

        * value  :单选按钮的默认值.

        * checked:单选按钮默认被选中.


* <input type=”button”>    :普通按钮.没有任何功能的按钮.

* <input type=”submit”>     :提交按钮.

* <input type=”reset”>     :重置按钮.

* <input type=”file”>      :文件上传的表单项.

* <input type=”hidden”>    :隐藏字段.

* <input type=”image”>     :图片按钮


* <select>                  :下拉列表.

* <textarea>               :文本域.

七.框架标签

框架标签:<frameset >



注意:标签与body标签是冲突,有frameset就可以没有body.

* 属性:

    * rows

    * cols

使用<frame>标签,frame代表切分的每个部分.

八.特殊字符标签

1) 空格  

2) <   ;<

3) >   '>  

九.案例

1.网站首页的显示

2.网站的注册的页面显示

                                                                  day02 css
div: 默认一个div占用一行
span:默认在同一行

css

选择器,声明

引入方式

1.行内引入

2.内部页面引入

3.外部引入

选择器:

1.元素选择器

2.ID选择器

3.类选择器

大小关系 元素选择器<类选择器<ID选择器

css浮动

css其他选择器

属性选择器

后代选择器

子类选择器

并列选择器

css盒子模型

css伪类


                                                                     day03
一.javascript

DOM

BOM

ECMAscript

二.js的基本语法

区分大小写

声明变量 var

";"结尾可写可不写

js的基本类型

原始类型

undefined:未定义类型

boolean :布尔类型

number: 数字类型

String: 字符串类型

null:空



引用类型

JS的运算符

三js的开发步骤

定义函数

function(){

函数体

}

匿名函数

window.onload=function(){

函数体

}

常用的事件

onclick(只能有一个) ondblclick onmousedown onsubmit

引入方式

一.<script></script>

二.将js代码编写在一个.js的文件中

正则表达式

1.reg.test(str)正则对象

2.str.match("")

                                                                                                       day05 jq

一.什么是JQuery

1.概述:是一个js的框架(库),对传统的js进行了封装

现在的企业的开发往往不适用传统的js开发,通常都会使用js框架来开发

2.js的常用框架

JQuery,ExtJS,DWR,PhotoType....

3.JQ对象和JS对象的区别

加载速度:

JQ比JS加载更快,效率更高

js是绘制完图形后才执行

jq是dom树加载就执行

加载次数

js可以多次加载,js.onload只能加载一次

问题:可不可以有两个window.onload事件

可以,但是只执行最后一个

注意事项:jq是一堆js

jq只能调用js属性和方法

jq只能调用jq的属性和方法

4.js对象和jq对象的互相转换

js-->jq

用$(js对象)

jq-->js

使用jq对象的索引取得js对象

二.案例一.广告的定时探入弹出

1.显示和隐藏

show();

使用一:jq对象.show();

使用二:jq对象.show(属性); 属性代表快慢

使用三:jq对象.show(毫秒值):几秒中显示出来

使用四:jq对象.show(毫秒值,function(){});

hide();

使用同show();

slideDown():向下滑动

使用同show()

slideUp():向上滑动

使用同show();

fadeIn():淡入

使用同show();

fadeOut():淡出

使用同show();

animate():自定义动画

toggle():单击切换函数

jq对象.toggle(函数1,函数2):单击第一下执行函数1,单击第二下执行函数2

对属性的操作

attr();添加属性

使用一$("").attr("src");

使用二$("").attr("src","...");

使用三$("").attr("属性":"属性值","属性","属性值");

removeattr();移除属性

prop(); 添加属性(jq1.6以上)

使用一$("").attr("src");

使用二$("").attr("src","...");

使用三$("").attr("属性":"属性值","属性","属性值");

removeprop();移除属性

问题:prop 和css的区别?

css是添加style里面的属性

prop是添加style以外的属性

addClass 添加样式

removeClass 移除样式

append()添加..

append与html的区别

append添加

html是覆盖

A.appendTo(B)把A添加到B

insertBefore()

insertAfter()

remove()

JQ元素的遍历

i 是索引

n 是索引对应的值

遍历的方式一

$.each(Objects.function(){i,n});

遍历的方式二

$("").each(function(i,n){});


0 个回复

您需要登录后才可以回帖 登录 | 加入黑马