网站首页 > 教程分享正文

看看这些，或许有你不懂滴!（你看一下不懂）

henian88 2024-09-10 14:11:29 教程分享 10 ℃ 0 评论

*CSS

*CSS的简介

*层叠样式表

*CSS与HTML的结合（4种）

*HTML的标签提供了属性style=“CSS的代码”

*HTML提供了标签<style type="text/css">CSS的代码</style> 放在<head>中间

*引入外部文件

@import url("CSS文件的地址");写在<style>标签中间

*通过html的标签<link rel="stylesheet" type="text/css" href="CSS的地址">

*优先级：一般情况下从上到下，由外到内，优先级从低到高的。

特殊情况下标签选择器<类选择器<ID选择器<style属性

*CSS的选择器：

*基本选择器

*标签名选择器

*div{CSS}

*类选择器

*有一个标签，提供了class属性<div class="值"></div>

*.值{CSS}

*ID选择器

*有一个标签，提供了class属性<div id="值"></div>

*#值{CSS}

*扩展选择器

*关联选择器

*中间使用空格例子：div font{CSS}

*组合选择器

*不同的选择器有相同的样式例子：.haha,#hehe{CSS}

*伪元素选择器

*CSS提供了一些选择器

*Css的布局

===================================================================================================

*JS

*js的简介

*js基于对象和事件驱动的脚本语言，作用客户端。

*特点：

*交互性

*安全性

*扩平台型

*js的组成

*ECMAScript

*BOM

*DOM

*js的语法

*关键字var function

*标示符

*注释///**/

*变量

*var 声明变量

*js的基本数据

String字符串类型

* var str="abc"; var str='abc';

Number 数字类型

* 不区分整数和小数

Boolean布尔类型

Null 空

Underfined未定义(声明没有赋值)

*typeof() *判断变量的类型

*js的运算符

alert(ture+1);//2

==比较值

===比较值和类型

*js的语句

if(num==4){

alert("ss");

}

for(var i=0;i<4;i++){

document.write("str"+"<br/>");

}

*js的数组

*声明数组两种方式

var arr=[22,33];

var arr=new Array(4);长度

var arr=new Array(4,5);元素

*length数组的长度

*js的函数

*声明函数function

function 函数名称(参照列表不能使用var关键字){

函数体;

return;返回

}

function getSum(){

return 100;

}

var sum=getSum;

sum();

===================================================================================================

*js动态函数和匿名函数

*动态函数

function getSum(){

return 50;

}

js提供内置对象Function

*匿名函数

*没有名称的函数

*js的全局

*全局变量：在<script>标签内部定义的变量，全局变量。

*局部变量：在函数的内部定义的变量，局部变量。

*javascript的对象和API

*Script对象

*声明

var str="abc";

var str=new String("abc");

*属性：length:字符串的长度

*方法：

*和HTML相关的方法(书写没有提示)

*bold()使用粗体显示字符串

*fontcolor(color) 参数是必须滴，设置字体的颜色

*fontcolor(size)设置字体的颜色(1-7)

*italics()斜体

*links(url) 设置链接

*sub下标

*sup 上标

*和java中String对象类似的(***)

*charAt(index)返回指定位置的字符

*indexOf(str,formIndex) 检索字符串，没有返回-1

*lastIndex(str,fromIndex)从后向前检索字符串

*replace(要替换的字符串，替换成啥)

*substring(start,stop)截取字符串

*substr(start，length)截取字符串，从那开始，截取多长

*定义一个方法：可以去掉字符串两边的空格。

var str =" a b c";

var newStr = mytrim(str);

newStr = "ab c";

*Array对象

*声明数组

var arr=[12,33];

*属性：length：长度

*方法：

*concat(元素，数组); 返回新的数组

*join(s)通过s表示(-),进行分隔，返回字符串

*pop()删除末尾的元素，返回最后一个元素

*push()向末尾添加元素，返回新数组的长度

*sort()排序的方法

*Data日期对象

var data=new Data();当前日期

*toLocaleString()转换本地的日期格式

*toLocaleDataString() 只包含日期

*toLocaleTimeString()只包含时间

*getData()返回一个月中的某一天(1-31)

*getDay()返回一周中的某一天(0-6)

*getMonth()返回月份(0-11)+1

*getFullYear()返回年份

*getTime()返回毫秒数

*setTime()通过毫秒数获取日期

*var data3= new Data(1415937050973);

*parse(str)解析字符串，返回毫秒数

*Data.parse(str);

str:

2014-11-14解析不了

11/14/2014可以解析

*Math和数学相关的对象

*math对象(静态的方法)

*ceil(x)上舍入

*floor(*)下舍入

*round(*) 四舍五入

*random()0-1的随机数

*RegExp对象

*正则表达式对象

*应用：编写注册的表单，对表单输入的内容进行校验

*var reg=new RegExp对象("表达式");(开发中不经常使用)

*var reg=/表达式/开发中经常使用

*var reg=/^表达式$/开发中经常使用

*exec(string)不经常使用

*如果匹配，返回匹配的结果

*test(string)

*如果匹配，返回是true,如果不匹配，返回时flase

if(reg.test("abc")){

//匹配上了

}else{

}

*全局函数

*使用全局函数，不需要任何对象

*全局函数可以拿过来使用。

*global帮着管理全局函数。

*全局函数

*eval()可以解析字符串，执行字符串中间的js代码

*isNaN()判断是否是非数字值

*parseInt()解析字符串，返回整数

*encodeURI()进行编码

*decodeURI()解析编码

*encodeURIComponent();

*decodeURIComponent();

*escape()

*unescape()

*BOM 浏览器对象模型

*(Brower Object Model)

Window窗口对象(*****)

Navigator和浏览器版本相关的对象(**)

*userAgent获取浏览器的相关信息

*window.navigator.userAgentwindow可以省略不写

Screen和屏幕相关的对象(-*)

History和浏览器历史有关(**)

*back()返回上一个页面

*forward去下一个页面

*go()

*传参数

go(1)等于forward()

go(-1)等于back()

Location和浏览器地址相关的对象(***)

*href 获取和设置浏览器的路径(***)

Document 文档对象

*onclick点击事件

*值的写法:

*document对象

*alert()弹出提示框

*confirm("参数")询问框

*提供俩按钮，确定和取消

*如果点击是确定，返回true,如果点击取消，返回flase

*moveBy()

*setInterval("函数"，毫秒值)定时相关的

*到了毫秒值后执行一次函数

*返回唯一的id值

*清楚定时

clearInterval(id的值)

clearTimeout()

*close()关闭浏览器的窗口

*open()打开浏览器窗口

*属性：

*opener返回对创建此窗口的窗口引用

*win open()弹出baidu的窗口

在baidu窗口中 baidu.opener 得到了win的引用

*document 对象方法

*document.getElementById("nameId");

*DOM 文档对象模型

===================================================================================================*js语法

*js的动态函数和匿名函数

*js动态函数Functionnew Function();

*匿名函数：没有名称的函数，起个名称

var add=function(){

}

*js中的全局变量和局部变量

*全局变量：定义<script>标签中的变量，在页面的任意位置上都能拿到。

*局部变量：定义在方法内部的变量

*js的对象和API

*String对象

*属性：length长度

*方法：

和HTML相关方法

*bold() 粗体

*fontcolor() 字体颜色

*sup()上标

*sub()下标

*和Java中String类似的方法

*charAt()返回指定位置字符

*indexOf()返回字符的位置

*substring(start,stop)截取字符串

*substr(start,length) 截取字符串

*Array数组

*声明数组

*var arr=[22];

*var arr=new Array(4或者"abc");

*方法：

*concat()链接数组或者元素

*pop()删除最后一个元素，返回

*push()向末尾添加一个元素，返回长度。

*sort()排序

*Data对象

*var data=new Data();当前对象

*方法：

*toLocaleDataString显示当地日期格式

*getFullYear()获取年份

*getMoth()获取月份(0-11)+1

*getData()几号

*getData()星期几

*getTime()毫秒值

*setTime()根据毫秒值设置时间

*Data.parse()可以字符串,返回是毫秒值

*Math数学

*ceil()上舍入

*floor()下舍入

*round()四舍五入

*random()随机数

*RegExp对象

*new RegExp("")

*var reg=/^表达式$/;(记住)如果匹配返回true,如果匹配不成功返回flase。

*全局函数

*eval()解析字符串，执行js的代码

*isNaN()判断是否是非数字值

*parseint()

*BOM浏览器对象模型

*window窗口对象

*alert()提示框

*confirm()询问框

*setInterval("run()",3000)每隔3秒执行run方法，返回唯一的id值

*setTimeout("run(()",3000)3秒后执行run方法，返回唯一的id值

*清楚定时器

*clearInterval(id)

*clearTimeout()

*open("","","") 弹出新的窗口

*close()关闭窗口

*navigator和浏览器版本相关

*属性

*history和历史相关

*back()上一页

*forward()下一页

*go(1或者-1)

*location和地址相关

*href=""获取和设置链接

=================================================================================================== *DOM文档对象模型

*Document Object Model

*文档：标记型文档 (HTML/XML)

*对象：封装属性和行为(方法)

*模型：共性特征的体现

*DOM解析HTML

*通过DOM方法，把HTML全部(元素(标签)、文本、属性)都封装成了对象。

*DOM想要操作标记型文档先解析。(解析器)

*DOM解析HTML(浏览器就可以HTML)

*浏览器DOM解析HTML？

*DOM的三个级别：

*DHTML不是一种编程语言

*html:封装数据。<span>展示给用户的数据</span>

*css:设置样式(显示效果)

*dom:操作HTML(解析HTML)

*js :提供逻辑(判断语句，循环预计)

*Document：代表整个文档。

*方法：

getElementById("id的值");通过元素的id的属性获取元素(标签)对象。

getElementsByName("name属性值");通过名称获取元素对象的集合(返回数组)

getElementsByTagName("标签名称") 通过标签名来获取元素对象的集合(返回元素)

*write("文本的内容(html标签)")把文本内容写到浏览器上

*createElement("元素名称");创建元素对象

*createTextNode("文本内容")创建文本对象

*appendChild("子节点")添加字节点

*Element对象

*获取元素对象

*getAttribute("属性名称");获取属性的值

*setAttribute("属性名称","属性的值");设置或者修改属性的值

*removeAttribute("属性名称");删除属性

*获取元素下的所有子节点(******)

*ul.getElementsByTagName();

*Node:节点对象

*nodeName：节点名称

*nodeType：节点类型

*nodeValue：节点的值

*parentNode获取父节点(永远是一个元素节点)

IE6-8？？？？？？？？？？？？？？？？IE9-11 ChromeFireFox

firstChild第一个节点？？？？？？？？？firstElementChild?第一个节点

lastChild最后一个节点？？？？？？？？？lastElementChild 最后一个节点

nextSibling下一同级节点？？？？？？？？nextElmentSibling？下一同级节点

previousSibling上一同级节点？？？？？？previousElementSibling?上一同级节点

<ul>

</ul>

*如果通过ul获取北京的子节点，使用是ul.firstElementChild;获取北京的子节点（IE9-11 Chrome FireFox）

*但是如果IE6-8,需要使用firstChild;

文本内容

</span>

*使用span的标签获取span中间的文本内容(也是对象)，需要使用firstChild.(不管什么浏览器)

*方法：

*hasChildNodes()检查是否包含字节点

*hasAttributes()检查是否包含属性

*appendChild(node)父节点调用，在末尾添加子节点

*insertBefore(new,old)检查是否包含属性

*replaceChild(new,old) 父节点调用,替换节点

*removeChild(node)父节点调用，删除节点

*cloneNode(boolean)不是父节点调用，复制节点

*boolean：如果是true,复制节点

：如果是flase,不复制子节点，默认是flase

*innerHTML:获取和设置文内容。

*innerHTML属性：

*获取文本内容

*设置文本内容

*事件：

onclick点击事假

onload加载时间

onfocus获取焦点事件

onblur失去焦点事件

*全选/全不选/反选练习

*指定默认值：checked只要出现在<input type="checkbox"/>,对号就上钩

*鼠标移动的事件

onmousemove

onmouseout

onmousemover

*鼠标点击事件(*****)

onclick单击

ondblclik双击

*加载和卸载

*onload(****)加载

*ondblclik双击

*获取焦点和失去焦点(****)

*onfocus获取焦点事件

*onunload卸载

*获取焦点和失去焦点(****)

*onfocus获取焦点

*onblur 失去焦点事件

*键盘

*onekeyup按下抬起

*改变事件(****)

*onchange

*控制表单的提交

onsubmit

*作业：

*insertBefore(new,old)在制定节点之前添加子节点

*在上海之前添加子节点

上一篇： h5测试期末（测试类h5模板）
下一篇：如何让你的小程序广告收益翻倍，无限插屏广告实现方法

网站首页 > 教程分享正文

看看这些，或许有你不懂滴!（你看一下不懂）

猜你喜欢

本文暂时没有评论，来添加一个吧(●'◡'●)

取消回复欢迎你发表评论:

网站首页 > 教程分享 正文

看看这些，或许有你不懂滴!（你看一下不懂）

猜你喜欢

本文暂时没有评论，来添加一个吧(●'◡'●)

取消回复欢迎 你 发表评论:

网站首页 > 教程分享正文

取消回复欢迎你发表评论: