js 笔记

js代码需要写到
script标签一旦引入外部标签那么内部标签就无法使用了
数据类型
1 原始数据类型(基本数据类型)
number:整数,小数、nan
String 字符串
bollean 布尔类型
null 一个对象为空的占位符
undefined:未定义如果一个变量没又给出始话值则会
数据的转换 可以通过 toString()转换为字符串
可以通过类型名字加括号来改变类型例如 String(a),Number(a)
来强制转换为数字
parsInt()将字符串转换为数字逐一字符判断字符是否是数字不能取值.
parsFloat()将字符串中取出一个有效的小数
2引用数据类型
对象
变量
如果使用var定义变量是局部变量
如果不适用var定义的是全局变量
由于是弱类型的语言 你想知道是哪个类型的语言要使用typeof(变量);就会
输出这个变量的类型

运算符
1 一元运算符家 只有一个运算符
++ – + (正好)
2算数运算符方
+ - * / % …
3 逻辑运算符家
&& || !
4 比较运算符
< > >= == ===(全等于)
5 三元运算符
? :
注意所有的 1 变量加正号之后都会变为number类型
2 不同类型的变量经行比较需要转换为同一种类型
3 全等于先比较变量类型是否一样在比较值如果有一个不一样
那么就会返回false
流程控制语句
if else
swithc(变量)在js中switch可以接受所有的类型
case;
break
创建对象的方法
1 var 方法名 = new Function(参数列表,方法体)
2 founction 方法名(参数列表){
方法体}
3 var 方法名 = function(参数列表){ 方法体}
可以使用 方法名.length 返回参数列表个数
特点
方法定义的参数类型不用声明
如果定义相同的方法名字会被覆盖
js中方法只和方法名相关 和参数类表无关 他可以谢多比期望参数多或者少
所有的参数都被封装在arguments[]这个数组中
数组对象Array
创建数组对象
1 var 数组名称 = new Array(元素列表);
2 var 数组名称 = new Array(数组长度);
3 var 数组名称 = [元素列表]
注意,在js中数组长度可变类型可变类似python中的列表
数组方法
join(“分隔符”)将数组中元素按照指定分隔符拼接为字符串
push(要添加的元素)向数组末尾条件一个或者更多元素并且返回新的长度
reverse()翻转数组的元素顺序
shift()返回数组中第一个元素
slice(选定元素)从摸个数组中返回选定元素
sort()对数组经行排序

      日期对象Data
      方法
            toLcaleString()返回当前对应时间的本地格式字符串
            getTime()返回当前日期对象的毫秒值距离1970年1月1日零点
     
数学对象Math
          该对象不用直创见直接使用
      属性 pI = π
     方法 random()返回一个0~1之间的一个随机数
             ceil(x)对数经行向上取整
             floor(x)对数经行向下取整
            round(x)把数进行四舍五入
      RegExp:正则表达式对象

创建方式
var reg = new RegExp(“正则表达式”);
var reg = /正则表达式/
方法
Test (参数)查看字符串是否符合正则表达式
Global对象 也就是全局对象不需要对象名指直劫调用方法名称就好了
encodeURI(字符串) 给字符串经行编码
decodeURI(字符串)给在字符串经行解码
encodURIComponent(字符串)给字符经行编码(他编码_
的字符更多)
decodeURIComponent(字符串)给字符串经行解码
直到不是数字位置将前面数字对像转换为number
isNaN(字符串)判断是不是nan
eval(字符串)解析字符串为脚本文件运行
自定义对象
var 对象名 = new 对象();
var 对象名 = {属性:值,属性:值}
可以通过直接 对象名.变量名 = 值;来添加属性
delet 对象名.变量名来删除对象
如果使用特殊的属性名不能采用点语法
可以 对象【属性名】=值;
取值 对象【属性名】
这种特殊的写法更加灵活可以直接写入变量
in 语法检查对象里面是否包含属性 ‘’属性名”in 对象名如果有
返回true 没有false
对象的属性可以是一个函数 也就是这个对象的方法
便利属性的方法
for (var n in 对象名){
n就为获取到所有对象属性的变量
}

全局对象 window 所有 在script 标签里面直接定义的就为全局变量、

this 指针 在函数调用时候 this 调用的永远是全局变量
在作为方法调用是this 就是当前对象

    定义函数的方法
          1 var 方法名 = new Function(参数列表,方法体)
          2   founction  方法名(参数列表){

方法体}
3 var 方法名 = function(参数列表){ 方法体}
可以使用 方法名.length 返回参数列表个数
匿名函数直使用加小括号就能运行
构造函数
构造函数和普通函数一样 只不过使用new调用用他就是一个构造方法
其他就是一个普通方法
在所有的函数中都有一个隐藏的属性 prototype 这里面保存的是一个对象
在对象中这个属性调用为 对象.proto 这个就相当于类变量。也可以设置类
方法

Dom宿主对象这个宿主对象是html网页(document)这个对象
用来操作网页的
方法
getElementById(“标签id”)获取到指定id的节点 。可以通过innerHTML()可以获取到html对象内部的代码
innerHTML()可以获取到html对象内部的标签对象
getElementsByTagName(String)通过制定标签名字获取一组节点返回一个类数组
的对象即使元素只有一个也会封装到数组里面返回
getElmentsByNameByName(String)根据name属性获取一组元素节点返回一个类数组

获取元素的子节点
方法
querySelector(string)根据一个css选择器字符串获得对象如果有多个
元素那么他只会或得到第一个元素的对象
querySelectorAll(string)他会把所有的元素封装为一个数组
getElemmentsByTagName()返回当Ian节点指定标签名的后代节点
getElemmentByClassName()返回class对象数组 IE8和以下版笨不不支持
属性
body返回body表前对象
documentElement 获取 hteml表签对象
all 返回所有对象的数组
childBides 表示当前所有子节点返回一个类数组
firstChild 表示第一个子节点
lastChild表示最后一个子节点
parentNode返回当前节点的父节点
previousSibling 表示返回当前前一个兄弟节点
nextSibling 表示当前节点后一个兄弟节点
createElement()创建元素节点
createText()创建文本接节点
父节点.appendChild(节点对象)将子节点添加到一个节点中
父节点. insertBefore(新节点对象,旧节点对象)在指定节点前面插入一个节点
父节点.removeChild(节点对象)删除子节点
父节点.replaceChild(新节点.旧节点)替换子节点
父对象.innerHTML += “Html对象”也可以完成增加 ,由于这种办法影响
对象.offsetTop 获取偏移量
对象.offsetLeft
大建议结合使用
例如
var li = Document.createElement(’'li");
li.innteHTML = “添加的内部代码”;
父对象.appendChild(li);
例如添加一个li标签
父对象.innerHTML += “

  • ”;
    通过js修改修改元素样式
    元素对象.style.样式名 = “属性值”;修改内连样式
    元素对象.currentStyle.样式名;读取当前使用的样式
    注意这个方法只适合ie浏览器 !!
    getComputdStyle(要获取的元素,传递一个伪元素一般为null)这个
    方法是window方法可以直接使用返回一个对象其中封装了当前元素对应
    的样式
    这个方法不适合ie8和他之下版本的浏览器
    事件
    事件函数每次一被触发就会产生一个事件对象被传进来 里面封装了关于这
    个事件的一切信息 比如 鼠表坐标 按键那个按键被按下 滚轮的方向 但是ie
    8以下事件的触发是作为一个window对象属性保存的
    事件添加有三种方法 一种给标签里面添加属性
    例如鼠标单击事件
    onclick = “事件相应代码”
    第二种方法
    获取组件对象.组件对象.οnclick= fountion(){事件触发代码体}
    onload()事件当页面加载完成之后触发 常用语window对象
    以上方法由于只能绑定一次有局限性
    第三种方法
    addEventListener(“时间名称”,相应函数,false)第三个参数是是否
    捕获到对象就立即触发 一般都是false 他的this为事件绑定对象
    ie8 为 attachEvent(“事件名称”,相应函数,false)这个函数先绑定后执行
    他的this为window
    如何吧this 统一
    function bind(obj,evenStr,callback){
    if(obj.addeventListener){
    obj.addeventListener(evenStr,callback,false)}
    else{
    obj.attachEvent(“on”+evenStr,function(){
    callback.call(obj);
    },false)
    }
    }
    事件的传递
    时间是由最外面的的元素捕获到的 但是他不会执行他会一直捕获到里面
    然后又目标元素开始由内而外的触发
    事件取消默认行为
    当使用直接赋值事件的时候可以通过返回false 来取消默认值
    使用addEventlistener添加事件的时候需要使用 event.preventDefautl();
    来取消默认值但是这个方法ie8没有
    常用事件
    onclick 鼠标单机事件
    onmouseover 在html上面移动鼠标
    onmouseout 从一个html上面移开鼠标
    onmousewheel 鼠标滚轮事件注意 火狐浏览器不兼容使用DOMouseScrall来帮定事件
    需要addEvenListener()添加
    onload html文件完成加载
    onkeydown 用户按下键盘
    onchange 元素改变
  • 鼠标单机事件对象
    clientX 返回当前鼠标单机对象的 x 坐标相对于可见窗口的
    clientY 返回当前鼠标对象的Y 相对于可见窗口的
    pageX 相对于页面的表 ie8不兼容
    鼠标滚轮事件对象
    pageY 相对于页面的坐标 ie8不兼容
    键盘事件
    键盘事件一般都会绑定给可以有焦点的对象或者是document对象
    onkeydown 当某个键被按下
    当鼠标被一直按下的时候回连续触发这个事件 第一次和第二次的触发间隔可能会稍微长
    一点
    onkeyup 当某个键被松开
    键盘对象
    keycode()可以通过这个方法来获取事件对象的
    altKey() 判断alt是否被按下
    ctrlKey()判断ctrl 是否被按下
    shiftKey()判断shift是否被按下

    事件的冒泡
    所谓的冒泡就是指事件的向上传导不向下传导
    通过事件对象.cancelBubble = true 就可以阻止时间的冒泡
    时间的委任
    当子类对象多绑定一个事件的时候就可以绑定他的父类来达到绑定的
    效果

    BOM
    浏览器对象模型BOM可以使我们通过js来操作浏览器它包含了一组对象
    window 代表的是整个浏览器窗口
    Navigator 代表的是当前浏览器信息
    这个对象大部分属性都不能用了 我们只有一个常用的userAgent这个
    属性返回的就是一个字符串包含着我们浏览器的信息
    Location 代表浏览器信息栏
    如果直接打印就会获取到当前地址的信息
    如果直接将location属性设置到一个路径这个页面就会跳转到相应的
    界面
    History 代表浏览器的历史记录 由于隐私原因该对象无法获取到具体的
    历史记录指定向前或者向后该操作只在当次操作中有效、
    属性
    length 获取浏览器浏览的页面长度
    back()加载history列表中前一个
    forward()加载history加载列表中后一个
    go(int x)加载列表中具体的某一个页面他需要一个参数来设置
    跳转到第几个负数向后跳 整数向前跳
    Screen 代表用户屏幕信息通过该对象可 以获取到用户的屏幕信息
    这些对象都是通过window对象保存的

    定时器
    setInterval(函数,函数执行速度 int)设置一个定时器
    clearInterval(定时器标识符)关闭定时器
    setTimeout(函数,函数延时时间 int)设置一个延时器
    clearTimeout(延时器标识)关闭一个延时器

    关于类的操作

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值