javascript的笔记精简版
在写javascript的代码时一定要用单引号或者双引号括起来,不带引号的话就以字符串来处理
在javascript里面不能以纯数字或者click命名函数或者变量
要想修改标签的属性,在html里面怎么写,javascript里面就怎么写,但有一个例外,就是class,要写成className
鼠标的响应事件:onmouseover、onmouseout
在javascript 中获得标签的属性值有两种方法 点(.)/方括号(万能的)
设置标签的背景图片: background-image:url('jrwm.png');注意一定得是单引号,如果是双引号就不行了
style加的样式是加在行间的
标签的优先级:
行间>id>class>标签
js里面的匿名函数,就是直接写function(),不用取名字,方便,当然也可以取名字
html在head中有时候标签没执行,就调用这个未知的标签就会报错,window.onload就可以解决这个问题,作用是等页面加载完成 之后调用。
window.onload=function(){这里写函数的内容};
返回的是一个数组,运用和c语言里面的数组一样
document.getElementsByTagName('这里面写标签的类型,比如div');
在js中input的checkbox要想选种就要这样写:xxx.checked=true/false;
在javascript中,this的作用就相当于oc中的self,谁调用它就是谁
通过html加入的自定义属性有些浏览器是不认的,只有在js中加入才有用的
innerHTML:
可以设置标签的值或读取标签的值,还可以写html代码
ECMAScript : 翻译 核心 解释器
DOM document Object Model 文档对象模型
BOM Browser Object Model 浏览器对象模型
alert(a==b) 先转换类型,然后再比较
alert(a===b) 不转换类型,直接比,尽可能用三个等号,因为严谨
css中的position重点:
如果sub1不存在一个有着position属性的父对象,那么那就会以document(非body,当body有margin等属性时,sub1并不受影响,除非body的position不为static)为定位对象,这个比较容易理解。
获取当前的样式,比如宽度
在IE中可以这么写:xxx.currentStyle.width
在火狐中可以这么写:xxx.getComputedStyle(odiv,false).width); 第二个参数填什么都行,这里面填的是false,个人爱好
数组的使用:
定义:var a=[1,2,3]; 或 var a=new Array(1,2,3);
数组添加新(单个)的元素:a.push(xxx) 相当于向数组的尾部添加一个xxx元素
数组的删除(单个)元素 : a.pop() 相当于删除数组尾部的一个元素
数组从头部开始删除一个元素: a.shift()
数组的头部添加一个元素: a.unshift(xxx)
a.splice的两种用法:
数组同时删除多个元素: a.splice(2,3) 表示从2开始,删除3个元素
插入/替换: a.splice(2,3,"a","b") 表于从2开始,删除3个元素,再从2开始,添加a和b
两个数组的合并:
比如数组a与数组b, a.concat(b) 表示连接a、b数组
数组的连接符: join 比如:数组a , a.join(‘-’)数组里面的元素用-连接起来了
数组的排序: sort() 可以直接调用这个方法排序字符串,但是排序数字的时候有点小区别 比如:a.sort(function(n1,n2){return n1-n2;} 这样就可以准确排序数字了
arguments 这是一个数组,是函数中保存函数所有的参数,有length属性。
js中的两种定时器:
倒计定时器函数:setTimeout() 里面有两参数,一个是要执行的函数,后面的一个是时间,单位是毫秒
循环定时器函数:setInterval() 里面有两参数,一个是要执行的函数,后面的一个是时间,时间是每隔多少调用的
javascript事件的两具阶段:
捕获与冒泡
比如用记点击<a>标签,document的点击会首先发生,然后是<body>的处理函数等最后到<a>元素,这就是捕获阶段。
冒泡: 比如鼠标的移入移出,只支持事件的冒泡,不支持捕获。
行内元素和块级元素使用浮动后的变化
有人说行内元素浮动后会变成块级元素,于是继续在网上搜索,又有人说不加display:block 就变不了块级元素,个人总结 下
行内 元素设置成浮动之后变得更加像inline-block(行内块级元素,设置成这个属性的元素会同时拥有行内和块级的特性,最明显的不同是它的默认宽度不是100%),这时候给行内元素设置padding-top和padding-botton或者width、height都是有效果的
给块级元素设置浮动的时候也是同样的情况,属性更加像是inline-block
表单验证:
onblur的使用:
事件会在对象失去焦点时候发生,比如离开输入框
onfocus :对象在获得焦点的时候调用
writeIn与write的区别:
两者都javascript向客户端输出的方法,对比可知写法上的差别是一个in line的简写,换言之,writeIn方法是以行输出的,相当于在write输出抂加上一个换行符
为什么有时再写window.onload时不没反应
首先,不是没有反应,而是这个函数再调用时函数可以还没有(也就是说不存在)。这个函数是在加载整个文档(document)完成的时候系统自动调用的,我想大家应该知道了吧,我们再深入了解一个,比如要响应点击事件的话,不能放在window.onload事件里面,因为这个方法是相当于oc(ios中的loadView方法)当创建一个对象完成的时候就自动调用,点击事件的话还没发生,另一种可能就是作用域问题,写在window.onload中的函数是闭包在一个匿名函数中的,自然无法访问这个函数。
在select中通过属性 .length可以获得option 的个数,也就是长度
textarea的简单说明(文本域):
创建如: <textarea rows="10" cols="3"></textarea>
cols: 是列 全称是coumns rows: 是行
在用js设置背景图片位置时需要注意的地方:
比如: a.style.backgroundPosition="-25px" + -50+"px"; 这是错的(缺少空格)
a.style.backgroundPosition="-25px " + -50+"px"; 这才是对的
或者这样分开写:
a.style.backgroundPositionX="-25px";
a.style.backgroundPositionY=-((i-1)*25)+"px";
定时器的循环调用的问题:
在 setInterval(move,30);这个move是个函数,不要这样写setInterval(move(),30);这是错误的,如果非得这样写,可以这样、setInterval(function(){ 代码},30);
DOM基础:
什么是DOM?其实就是document
查看子节点的个数: childNodes.length 不同的浏览器个数不同,有两种情况,一种是:空的结点数加上实际的结点数,第二种是不包括空的结点数,什么是空的结点,就是没有标签包围的区域,也就是说文本没有语义修饰。
时是文本节点(也就是空的结节点)、属性节点是 如果等于1话那就是元素结点
children这也是数组,和上面的相比,直接只算元素的个数,不包括空的结点
parentNode:获取到父结点
offsetParent:可以获取自身根据哪个父类来定位的
创建DOM元素
createElement(标签名) 创建一个节点
appendChild(节点) 添加一个节点
插入元素: insertBefore(节点,原有节点,在谁之前 )在已有元素前插入
删除DOM元素:removeChild(节点) 删除一个节点
// oDiv.style.filter='alpha(opacity:'+alpha+')';
oDiv.style.opacity=alpha/100;
开启定时器:返回值=setInterval(function(){
oDiv.style.left=oDiv.offsetLeft+10+'px';},30);
关闭定时器:clearInterval(返回值)
opacity与filter:alpha(opacity=20)的区别:
opacity属性主要是针对高处版本及主流浏览器,filter主要是针对ie低版本用的
参数:filter : 要使用的滤镜效果。多个滤镜之间用空格隔开。
说明:
设置或检索对象所应用的滤镜效果。
要使用该属性,对象必须具有height,width,position三个属性中的一个。
滤镜的机制是可扩展的。可以开发和使用第三方滤镜。
该属性在MAC平台上不可用。
对应的脚本特性为filter。
IE4.0以上版本,支持以下14种滤镜:
滤镜名 说明
Alpha 让HTML元件呈现出透明的渐进效果
Blur 让HTML元件产生风吹模糊的效果
Chroma 让图像中的某一颜色变成透明色
DropShadow 让HTML元件有一个下落式的阴影
FlipH 让HTML元件水平翻转
FlipV 让HTML元件垂直翻转
Glow 在元件的周围产生光晕而模糊的效果
Gray 把一个彩色的图片变成黑白色
Invert 产生图片的照片底片的效果
Light 在HTML元件上放置一个光影
Mask 利用另一个HTML元件在另一个元件上产生图像的遮罩
Shadow 产生一个比较立体的阴影
Wave 让HTML元件产生水平或是垂直方向上的波浪变形
XRay 产生HTML元件的轮廓,就像是照X光一样
Alpha 滤镜参数详解
参数名 说明 取值说明
Opacity 不透明的程度,百分比。 从0到100,0表是完全透明,100表示完全不透明。
FinishOpacity 这是一个同Opacity一起使用的选择性的参数,当同时Opacity和FinishOpacity时,可以制作出透明渐进的效果,比较酷。 从0到100,0表是完全透明,100表示完全不透明。
Style 当同时设定了Opacity和finishOpacity产生透明渐进时,它主要是用赤指定渐进的显示形状。 0:没有渐进;1:直线渐进;2:圆形渐进;3:矩形辐射。
StartX 渐进开始的 X 坐标值
StartY 渐进开始的 Y 坐标值
FinishX 渐进结束的 X 坐标值
FinishY 渐进结束的 Y 坐标值
javascript的笔记精简版的更多相关文章
- PHP面试专用笔记精简版
[PHP笔记] 1.require 遇到即包含文件,require_once 只包含一次.require 遇到错误会终止,一般放在程序的最前面:include遇到错误会继续执行,一般放在流程控制语句中 ...
- Git学习笔记-精简版
注意本文参考廖雪博客: http://www.liaoxuefeng.com/wiki/0013739516305929606dd18361248578c67b8067c8c017b000 一:Git ...
- 图解HTTP读书笔记--精简版
这本书重点讲了两点,分别是 HTTP的报文格式 HTTPS比HTTP优秀在哪里 接下来分部分讨论一下: 1. HTTP的报文格式 请求报文格式: 请求行 指明请求方法 请求路径 和协议 如 ...
- 用 JS 点击左右按钮 使图片切换 - 最精简版-ljx2380000-ChinaUnix博客
body { font-family: "Microsoft YaHei UI","Microsoft YaHei",SimSun,"Segoe UI ...
- Linux上oracle精简版客户端快速部署
RHEL6 + Oracle 11g客户端快速部署 需求:只是用到客户端的sqlplus, sqlldr功能. 方案:用精简版实现客户端的快速部署 1.上传oracle精简版客户端到服务器/tmp目录 ...
- ArcGIS10.2.1精简版、ArcGIS_Desktop10_Tutorial、破解文件等下载地址
原版ArcGIS for Desktop的ISO文件一般都在4.5G以上,一般人用不上里面很多工具,下载回来又浪费时间,现推出ArcGIS10.2.1精简版(里面只包含主程序.Data Interop ...
- TeamViewer12.0.71503(远程控制软件)精简版 单文件企业版介绍
TeamViewer 是一款能在任何防火墙和 NAT 代理的后台用于远程控制,桌面共享和文件传输的简单且快速的解决方案.为了连接到另一台计算机,只需要在两台计算机上同时运行 TeamViewer 即可 ...
- Log4j快速使用精简版
Log4j快速使用精简版 1.导入log4j-1.2.17.jar包 2.在src根目录下创建log4j.properties文件 log4j.rootLogger=INFO, CONSOLE, FI ...
- VMware10.06精简版安装后台运行
VMware10.06精简版安装时会出现一个安装功能选择菜单,里面有一条后台运行必选功能,一般人会跳过条.当你打算在服务器上用vmware时,一定要安装后台运行服务,否则你无法换出正在运行的后台虚拟机 ...
随机推荐
- ios cordite 读取错误CoreData could not fulfill a fault for '0x15b4a870
解释在这里 http://stackoverflow.com/questions/14296892/nsobjectinaccessibleexception-reason-coredata-coul ...
- Storm集成Kafka应用的开发
我们知道storm的作用主要是进行流式计算,对于源源不断的均匀数据流流入处理是非常有效的,而现实生活中大部分场景并不是均匀的数据流,而是时而多时而少的数据流入,这种情况下显然用批量处理是不合适的,如果 ...
- winrt获取文件MD5码
//小文件 public static string ComputeMD5(byte[] bytes) { var alg = HashAlgorithmProvider.OpenAlgorithm( ...
- Kinect SDK 安装失败
错误提示:Kinect Management failed to start. 原因: 1, Kinect Management 服务相依的 Plug and Play的服务没有启动. 2,系统安装了 ...
- HDU 4966 GGS-DDU(最小树形图)
n个技能,每个技能有0-a[i]的等级,m个课程,每个课程需要前置技能c[i]至少达到lv1[i]等级,效果是技能d[i]达到lv2[i]等级,花费w[i]. 输出最小花费使得全技能满级(初始全技能0 ...
- window.parent 与 window.opener
window.parent针对iframe,window.opener针对window.open 父页面parent.jsp: <%@ page language="java" ...
- bootstrap添加时间控件
$('#startTime').daterangepicker({ singleDatePicker: true,format:"YYYY-MM-DD HH:mm:ss",time ...
- 【XLL API 函数】xlSheetId
查找命名的工作表ID,用于外部引用. 原型 Excel12(xlSheetId, LPXLOPER12 pxRes, 1, LPXLOPER12 pxSheetName); 参数 pxSheetNam ...
- JS图表插件(柱形图、饼状图、折线图)
http://www.open-open.com/lib/view/open1406378625726.html
- jquery中dom元素的attr和prop方法的理解
一.背景 在编写使用高版本[ jQuery 1.6 开始新增了一个方法 prop()]的jquery插件进行编写js代码的时候,经常不知道dom元素的attr和prop方法到底有什么区别?各自有什么应 ...