JavaScript + jQuery【不完整】


一、JavaScript 行为层

  • JavaScript简介
  1. JavaScript历史: 1995年,网景公司 凭借其Navigator浏览器成为Web时代开启时最著名的第一代互联网公司。由于网景公司希望能在静态HTML页面上添加一些动态效果,于是叫Brendan Eich这哥们在两周之内设计出了JavaScript语言。
  2. ECMAScript: 一年后微软又模仿JavaScript开发了JScript,为了让JavaScript成为全球标准,几个公司联合ECMA(European Computer Manufacturers Association)组织定制了JavaScript语言的标准,被称为ECMAScript标准。
  3. JavaScript版本
  4. 一个完整的JavaScript包括:ECMAScript【语法 变量和数据类型 运算符 逻辑控制语句 关键字保留字 对象】+BOM【浏览器对象模型】+DOM【文档对象模型】
  • 特点
  1. JavaScript主要用来在HTML页面中添加交互行为
  2. JavaScript是一种脚本语言,语法和java类似
  3. JavaScript一般用来编写客户端的脚本
  4. JavaScript是一种解释性语言,边执行边解释
  • 基本语法
  1. JavaScript严格区分大小写,如果弄错了大小写,程序将报错或者运行不正常。
  2. 声明:var 合法的变量名;
  3. 由于JavaScript属于弱类型语言,因此允许不声明变量而直接使用,系统将会自动声明该变量 如:x=88;
  • 对象
  1. 通过new Object()方式创建对象
  2. 字面量赋值方式创建对象
  • 数据类型和变量
ECMAScript提供了 typeof(变量或值) 来判断一个值或变量是哪种数据类型
  1. Number(JavaScript不区分整数和浮点数,统一用Number表示)
  • 123; // 整数123
  • 0.456; // 浮点数0.456
  • 1.2345e3; // 科学计数法表示1.2345x1000,等同于1234.5
  • -99; // 负数
  • 0xlf; // 十进制的31
  • NaN; // NaN表示Not a Number,当无法计算结果时用NaN表示
  • Infinity; // Infinity表示无限大,当数值超过了JavaScript的Number所能表示的最大值时,就表示为Infinity

字符串

  • 以单引号'或双引号"括起来的任意文本,比如'abc',"xyz"等等。请注意,''或""本身只是一种表示方式,不是字符串的一部分,因此,字符串'abc'只有a,b,c这3个字符。
  • 常用方法1:indexOf(str,index):返回指定字符首次出现的位置
  • 常用方法2:charAt(index):通过索引值查找,返回指定字符
  • 常用方法3: toLowerCase():字符串小写
  • 常用方法4: toUpperCase():字符串大写
  • 常用方法5: substring(from,to):传入两个索引值,截取两个值之间的字符串,不包括to值。返回新字符串,若start为负数,默认start为0
  • 常用方法6: split(spearator,limit):分割字符串,以数组形式返回。spearator指定切割的地方,limit设置返回字符串的最大长度

布尔值:经常用在条件判断中,可以直接用true、false表示布尔值,也可以通过布尔运算计算出来 。

  • true; // 这是一个true值
  • false; // 这是一个false值
  • 2 > 1; // 这是一个true值
  • 2 >= 3; // 这是一个false值

null和undefined

  • null表示一个“空”的值,它和0以及空字符串''不同,0是一个数值,''表示长度为0的字符串,而null表示“空”
  • 当声明的变量未初始化时,该变量的默认值是undefined,它表示“未定义”
  • 在其他语言中,也有类似JavaScript的null的表示,例如Java也用null,Swift用nil,Python用None表示。
  • JavaScript的设计者希望用null表示一个空的值,而undefined表示值未定义。事实证明,这并没有什么用,区分两者的意义不大。大多数情况下,我们都应该用null。undefined仅仅在判断函数参数是否传递的情况下有用。
  • undefined表示表明了变量但未对该变量赋值,null便是对该变量赋予了一个空值
  • 数组: 是一组按顺序排列的集合,集合的每个值称为元素。
  • JavaScript的数组可以包括任意数据类型。例如: [1, 2, 3.14, 'Hello', null, true];
  • 另一种创建数组的方法是通过Array()函数实现: new Array(1, 2, 3); // 创建了数组[1, 2, 3]
  • 出于代码的可读性考虑,强烈建议直接使用[]
  • 数组的元素可以通过索引来访问。请注意,索引的起始值为0
  1. slice()
  • slice()就是对应String的substring()版本,它截取Array的部分元素,然后返回一个新的Array
  • * slice()的起止参数包括开始索引,不包括结束索引。
  • 如果不给slice()传递任何参数,它就会从头到尾截取所有元素。利用这一点,我们可以很容易地复制一个Array
push()和pop()
  • push()向Array的末尾添加若干元素,pop()则把Array的最后一个元素删除掉
unshift()和shift()
  • 如果要往Array的头部添加若干元素,使用unshift()方法,shift()方法则把Array的第一个元素删掉
sort()和reverse()
  • sort()可以对当前Array进行排序,它会直接修改当前Array的元素位置,直接调用时,按照默认顺序排序;
  • reverse()把整个Array的元素给掉个个,也就是反转

splice()

  • splice()方法是修改Array的“万能方法”它从指定的索引开始删除若干元素,然后再从该位置添加若干元素
  • 如果要往Array的头部添加若干元素,使用unshift()方法,shift()方法则把Array的第一个元素删掉

concat()

  • concat()方法把当前的Array和另一个Array连接起来,并返回一个新的Array
  • 注意,concat()方法并没有修改当前Array,而是返回了一个新的Array。
  • 实际上,concat()方法可以接收任意个元素和Array,并且自动把Array拆开,然后全部添加到新的Array里

join()

  • 把当前Array的每个元素都用指定的字符串连接起来,然后返回连接后的字符串
  • join(分隔符);
  • 运算符号
  1. 算数运算符:+          -        *         /        %       ++        --
  2. 比较运算符:>          <      >=      <=     ==       !=        ===       !==
  3. 逻辑运算符:&&       ||         !
  4. 赋值运算符:=          +=     -=
  • 常用系统函数
  1. parseInt()与parseFloat()
  • 这两个方法的参数数据类型都是字符串
  • parseInt() 是将数字开头的整数部分取出来
  • parseFloat()是将数字开头的整数或浮点数取出来

isNaN()函数: 用于检查一个变量是否为数值,如果是,则返回false,如果不是,则返回true。 eval()函数: 用于计算并返回字符串表达式的值

  • JavaScript操作BOM对象(一)
  1. 常用属性
  • history   有关客户访问过的URL的信息

    • back()加载history对象列表中的前一个URL
    • forward()加载history 对象列表中的下一个URL
    • go()加载history 对象列表中的某个具体URL
  • location  有关当前URL的信息
    • host:设置或返回主机名和当前URL的端口号
    • hostname:设置或返回当前URL的主机名
    • href:设置或返回完整的URL
    • reload()重新加载当前文档
    • reolace()用新的文档替换当前文档
  • screen只读属性,包含有关客户端显示屏的信息

常用方法

  • prompt()显示可提示用户输入的对话框
  • alert()显示一个带有提示信息和一个“确定”按钮的警示对话框
  • confirm()显示一个带有提示信息、“确定”和“取消”按钮的对话框
  • close()关闭浏览器窗口
  • open()打开一个新的浏览器窗口,加载给定URL所指定的文档
  • setTimeout()在指定的毫秒数后调用函数或计算表达式
  • setInterval()按照指定的周期(以毫秒计)来调用函数或表达式

document对象

  • 属性1: referrer:返回载入当前文档的URL
  • 属性2: URL:返回当前文档的URL
  • 方法1: getElementById()返回对拥有指定id的第一个对象的引用
  • 方法2: getElementByName()返回带有指定名称的对象的集合
  • 方法3: getElementsByTagName()返回带有指定标签名的对象的集合
  • 方法4: write()向文档写文本、HTML表达式或JavaScript代码
  • JavaScript操作BOM对象(二 内置对象)https://www.cnblogs.com/liuluteresa/p/6413988.html
  1. Date
  • getDay()返回一周中的第几天(0-6)
  • getYear()返回年份.2000年以前为2位,2000(包含)以后为4位
  • getFullYear()返回完整的4位年份数
  • getMonth()返回月份数(0-11)
  • getDate()返回日(1-31)
  • getHours()返回小时数(0-23)
  • getMinutes()返回分钟(0-59)
  • getTime()返回从1970年1月1号0:0:0到现在一共花去的毫秒数
Math  http://www.runoob.com/jsref/jsref-obj-math.html
  • ceil(x) 对数进行上舍入
  • floor(x)对数进行下舍入
  • round(x)四舍五入
  • random() 返回0~1之间的随机数
  • JavaScript操作DOM对象  https://www.cnblogs.com/Chenghao-He/p/7056394.html
  1. 操作节点属性
  • attributes     // 获取所有标签属性
  • setAttribute("属性名","属性值")   // 设置标签属性
  • getAttribute("属性名")    // 获取指定标签属性

创建和插入节点

  • createElement(tagName)创建一个标签名为tagName的新元素节点
  • A.appendChild(B)把B节点追加至A节点的末尾
  • insertBefore(A,B)把A节点插入至B节点前
  • cloneNode(deep)复制某个指定的节点

删除和替换节点

  • removeChild(node)删除指定的子节点
  • replaceChild(newnode,oldnode)用其他的节点替换指定的节点

style属性   https://www.cnblogs.com/zhuhuibiao/p/9825334.html 获取元素位置

  • 面向对象编程
  1. 构造函数 和 原型对象
  2. 原型继承 和 class继承
  • strict模式
  • Map https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Map
  • Set   https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Set

二、jQuery http://www.w3school.com.cn/jquery/index.asp

  • jQuery的优势
  1. 轻量级
  2. 强大的选择器
  3. 出色的DOM封装
  4. 可靠的事件处理机制
  5. 出色的浏览器兼容性
  6. 隐式迭代
  7. 丰富的插件支持
  • 选择器 http://phpstudy.php.cn/e/jquery/jquery_ref_selectors.html
  • 基本过滤选择器
  1. :first           获取数组中第一个元素
  2. :last            获取数组中最后一个
  3. :eq(selector)   获取指定索引
  4. :gt(index)        大于指定索引
  5. :lt(index)         小于指定索引
  6. :even              偶数,从0开始计数(0、2、4即1/3/5行)
  7. :odd                奇数
  8. :not(selector)    去除所有与指定选择器匹配的元素
  9. :header          获得所有标题元素
  10. :animated       获得所有动画
  11. :focus            获得焦点
  • 可见性过滤选择器
  1. :Hidden:匹配所有不可见元素,或者type为hidden的元素
  2. :Visible:匹配所有的可见元素
  3. :Val():获得匹配元素的当前值。Vallue的值
  4. :Show();显示隐藏的匹配元素。
  5. :Hide();隐藏所有的元素
  • 事件 http://phpstudy.php.cn/e/jquery/jquery_ref_events.html

转载于:https://www.cnblogs.com/guisenbin/p/10454451.html

行为层JavaScript+jQuery相关推荐

  1. Java项目:嘟嘟校园一卡通系统(java+JSP+Servlet+html+css+JavaScript+JQuery+Ajax+mysql)

    源码获取:博客首页 "资源" 里下载! 一.项目简述 功能:卡管理,卡消费,卡充值,图书借阅,消费,记录,注销等等功能. 二.项目运行 环境配置: Jdk1.8 + Tomcat8 ...

  2. Java项目:饰品商城系统(java+SSM+JSP+javascript+jQuery+Mysql)

    源码获取:俺的博客首页 "资源" 里下载! 项目介绍 本项目分为前台与后台,有普通用户与管理员两种角色: 管理员角色包含以下功能: 管理员登录,用户管理,一级分类管理,二级分类管理 ...

  3. Java项目:演唱会售票管理系统(java+SSM+JSP+JavaScript+jQuery+mysql)

    源码获取:俺的博客首页 "资源" 里下载! 项目介绍 本项目分为前后台,前台为普通用户登录,后台为管理员登录: 管理员角色包含以下功能: 管理员登录,管理员信息管理,网站用户信息管 ...

  4. 基于javaweb的演唱会售票管理系统(java+ssm+jsp+javascript+jquery+mysql)

    基于javaweb的演唱会售票管理系统(java+ssm+jsp+javascript+jquery+mysql) 运行环境 Java≥8.MySQL≥5.7.Tomcat≥8 开发工具 eclips ...

  5. 如何在JavaScript / jQuery中查找数组是否包含特定字符串? [重复]

    本文翻译自:How to find if an array contains a specific string in JavaScript/jQuery? [duplicate] This ques ...

  6. 生日祝福(HTML+CSS+JavaScript+jQuery)

    生日倒计时 下载地址:[生日祝福(HTML+CSS+JavaScript+jQuery).zip-教育文档类资源-CSDN下载]

  7. javascript:jquery.history.js使用方法

    javascript:jquery.history.js使用方法 step1:download jquery.history.js step2:create a test page as follow ...

  8. Java实现动态加载页面_[Java教程]动态加载页面数据的小工具 javascript + jQuery (持续更新)...

    [Java教程]动态加载页面数据的小工具 javascript + jQuery (持续更新) 0 2014-05-07 18:00:06 使用该控件,可以根据url,参数,加载html记录模板(包含 ...

  9. 【前端学习笔记】JavaScript + jQuery + Vue.js + Element-UI

    前端学习笔记 JavaScript jQuery Vue.js Element-UI Java 后端部分的笔记:Java 后端笔记 JavaScript 基础语法(数据类型.字符串.数组.对象.Map ...

最新文章

  1. java拷贝压缩文件_Android java, 快速文件拷贝,文件压缩,获得系统时间 | 学步园...
  2. 解决Caused by: java.lang.NoSuchMethodException: com.mchange.v2.c3p0.cfg.C3P0Config.init()的总结...
  3. websocket采用tomcat方式,IOC类对象无法注入的解决方案
  4. 哪一类功率放大电路效率最高_电路分析基础(8)-最大功率传输与阻抗匹配分析...
  5. leetcode 6 Z 字形变换 c代码
  6. 开发类似vs的黑色风格_传闻:2020年《使命召唤》将是《黑色行动》重启作品
  7. 说干就干的p2psearcher2013
  8. python是动态语言
  9. Tips--windows系统下gcc编译C文件为so共享库
  10. Scala 隐式转换
  11. 记录一下目前thinksoar portal的进度和计划!
  12. 【Qt串口调试助手】1.6 - QTimer定时自动发送
  13. jquery双击修改_jQuery双击
  14. Linux常用远程连接工具介绍,总有一款适合你
  15. 详解Python中列表切片及浅拷贝的关系(上)
  16. 如何通过反向代理实现伪装IP?
  17. Praat脚本-004 | 替换标注内容
  18. 洛谷 P1359 租用游艇
  19. 2022年软件设计师考试复习资料(1)
  20. 二极管专题:二极管钳位电路

热门文章

  1. Ubuntu wine QQ 微信乱码
  2. 无线网可拼服务器吗6,当WiFi 6遇到了WiFi 6+,我们的网速真的变快了吗?
  3. Dreamweaver CS6 Mac破解版
  4. 没有公网IP,自建网站如何让外网访问?
  5. asp.net是什么?
  6. 爱奇艺真的有1亿付费会员?十五扒了扒用户数据告诉你更多真相
  7. Qt QLineEdit 信号函数总结
  8. Qt父窗体子窗体获取绝对相对坐标全面剖析(待续)
  9. linux命令中ps -ef是什么意思
  10. 【linux】shell脚本 ps 命令学习