在写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.οnlοad=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    不同的浏览器个数不同,有两种情况,一种是:空的结点数加上实际的结点数,第二种是不包括空的结点数,什么是空的结点,就是没有标签包围的区域,也就是说文本没有语义修饰。

childNodes[i].nodeType==3时是文本节点(也就是空的结节点)、属性节点是2   如果等于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 坐标值

转载于:https://www.cnblogs.com/qq1871707128/p/5998892.html

javascript的笔记精简版相关推荐

  1. 网站搭建笔记精简版---廖雪峰WebApp实战-Day1:搭建开发环境笔记

    网站搭建笔记精简版-廖雪峰教程学习@[三川水祭] 仅作学习交流使用,将来的你会感谢现在拼命努力的自己!!! 目录 win7安装配置git github赋予本机权限 新建github项目 本地搭建网页框 ...

  2. PHP面试专用笔记精简版

    [PHP笔记] 1.require 遇到即包含文件,require_once 只包含一次.require 遇到错误会终止,一般放在程序的最前面:include遇到错误会继续执行,一般放在流程控制语句中 ...

  3. javascript全笔记-基础版(尚硅谷视频李立超老师)

    目录 一.JavaScript简介 1.1 JS简介 1.2 JS的HelloWorld 1.3 JS代码编写的位置 二.JS的基础语法 2.1 JS的基本语法 2.2 字面量与变量 2.3 标识符 ...

  4. 【红宝书笔记精简版】第十二章 BOM

    目录 12.1 window 对象 12.1.1 Global 作用域 12.1.2 窗口关系 12.1.3 窗口位置与像素比 12.1.4 窗口大小 12.1.5 视口位置 12.1.6 导航与打开 ...

  5. 创业圣经《从0到1》读书笔记精简版(首发虎嗅今日头条)

    这几天刚到手当前炙手可热的来自PayPal创始人Peter Thiel的<Zero to One>,中文名<从0到1>,由高玉芳翻译,中信出版社出版. 本文是我的读书笔记. 第 ...

  6. 【红宝书笔记精简版】 第二十四章 网络请求与远程资源

    目录 24.1 XMLHttpRequest 对象 24.1.1 使用 XHR 24.1.2 HTTP 头部 24.1.3 GET 请求 24.1.4 POST 请求 24.1.5 XMLHttpRe ...

  7. js 红宝书学习笔记精简版 第一至三章

    注: 本文js代码均已在本地实现过,如有异常问题,请在评论区留言.ctrl+f 可搜索有效内容, 加粗为重点 蓝色字体 为重中之重 (一) 什么是js 1995 年,JavaScript 问世. 完整 ...

  8. javascript检测浏览器精简版

    代码  1 /*written by xp in 8z at Mar 4,2010.QQ:251089096*/  2 var sUserAgent = navigator.userAgent;  3 ...

  9. 用 JS 点击左右按钮 使图片切换 - 最精简版-ljx2380000-ChinaUnix博客

    用 JS 点击左右按钮 使图片切换 - 最精简版-ljx2380000-ChinaUnix博客 代码部分: 点击(此处)折叠或打开 <!DOCTYPE html PUBLIC "-// ...

  10. JavaScript学习笔记05【高级——DOM对象】

    w3school 在线教程:https://www.w3school.com.cn JavaScript学习笔记01[基础--简介.基础语法.运算符.特殊语法.流程控制语句][day01] JavaS ...

最新文章

  1. 记一次WiFi芯片W600上的一个浮点运算
  2. Tunnel Warfare(HDU1540+线段树+区间合并)
  3. 服务器双网卡设置安全_服务器硬件介绍之服务器主板
  4. 【经典回放】JavaScript学习详细干货笔记之(三)
  5. AtCoder Regular Contest 125
  6. [导入]关于OllyDbg 2.0的消息..
  7. 算法python知乎_20个算法李小文知乎文章与Github代码汇总
  8. github团队合作
  9. 虽然自己不是唱歌的材料
  10. mysql存储过程 大小写_MySQL数据记录大小写敏感问题【转】
  11. 《深度学习要领》端到端的深度学习技术
  12. 关于迅雷试用短租日租会员的一些渠道收集
  13. 示波器电流探头工作原理-Pintech品致
  14. 怎么删除计算机多余的启动项,怎么删除Win7多余的开机启动项
  15. python的并行计算框架
  16. html中b和strong的区别,i和em的区别
  17. 计算机应用技术职业生涯规划书5000字,计算机应用职业生涯规划书5000字
  18. 微型计算机基础理论怎么学,微型计算机原理(孟辉)
  19. 程序员放弃阿里工作回家当公务员,朋友:年纪轻轻为什么不奋斗
  20. 快速收集图片并批量重命名(在线收集表、QQ收集表、腾讯收集表+方方格子)(图片批量重命名)

热门文章

  1. hdu 4300(kmp)
  2. 转载:PLSQL中显示Cursor、隐示Cursor、动态Ref Cursor区别
  3. nginx 认证访问web
  4. 13、第七 - 网络编程基础 - Python中协程EVENT()函数-事件函数
  5. MyBatis 简介
  6. Docker基础-容器操作
  7. CXF webservice完整例子
  8. Linux下编写 makefile 详细教程
  9. 9行自定义函数教你用Python发送电子邮件!
  10. 99.9%的数据分析师,都做不到这些