WEB开发技术基础知识整理——JS与jQuery

简介

直译客户端脚本语言,不需要预编译,浏览器直接解释运行。

动态,跨平台,等等……

HTML定义用户互交事件,当事件发生时可执行指定JS代码

ECMAScript,脚本语言规范,JavaScript是基于该规范的一个实现,后续JS代码,将基于ES6代码规范编写

666666

通用HTML事件

onchange 标签发生改变

onclick 点击之后

onload 完成页面加载

……

js代码引入方式

通过script标签直接引入html文件

js文件引入

javascript语法

let

声明一个作用区域的变量语句表达式

var

定义,不受快内块外限制。

操作符

操作符+ - * 、 % ++ --、

数据类型

变量可以接受许多多数据类型。

函数声明

function1234(p,q){returnp1*p2;}document.getelementbyid("demo").innerhtml=text;

箭头函数表达式

箭头函数表达式的语法比函数表达式更短,并且没有自己的this,arguments,super或 new.target

适合回调的匿名函数

json

Json对象,属性以键值对保存,大括号,分号,双引号,逗号,方括号(数组),方法等等

例如:{“type”:“111”,“从v”,“fdfs”};

jsoutput

JavaScript can "display" data in different ways:

Writing into an alert box, using window.alert().

Writing into the HTML output using document.write().

Writing into an HTML element, using innerHTML.

Writing into the browser console, using console.log().

第四部分——jQuery

简介

jQuery的目的是使您的网站更容易使用JavaScript。

jQuery接受许多需要许多行JavaScript代码才能完成的常见任务,并将它们包装成可以用一行代码调用的方法。

轻量,压缩版极小,减少网络数据传输 (3.2.1,84.6K)

强大的基于CSS的元素选择器

大量的DOM操作封装

链式编程

隐式迭代

实现了操作行为与HTML文档的分离

丰富完善的生态

主流前端JS框架的支持

无需关心浏览器兼容性问题

免费开源

使用方法

从jQuery网站下载jQuery库

从CDN中包括jQuery,比如谷歌

下载的jQuery有两种版本:

生产版本-这是为您的生活网站,因为它已经缩小和压缩

开发版本-这是用于测试和开发(未压缩和可读代码)

基本语法

Basic syntax is: $(selector).action()

回调函数

JavaScript语句逐行执行。但是,由于效果,即使效果未完成,也可以运行下一行代码。这可能造成错误。

在当前效果完成100%之后执行回调函数。

$(function(){$("#b1").click(()=>{//$("#p1").hide(()=>{alert("hidden");});});});

选择器

从$开始,括号内选择类似于css。

部分功能

hover()鼠标悬浮

val()修改元素属性

prop()修改获取元素属性

hide上下隐藏

show()上下显示

fadein()淡入

fadeout()淡出

fadetoggle()交替

fadeto()给定不透明的衰减

slidedown()下滑

slideup()向上滑

slidetoggle()上下交替

prepend()指定元素内部前面添加元素

append()元素内部添加内容

after()指定元素后添加平级元素

before()指定元素前添加平级元素

remove()移除选择的元素

remove(...)移除子元素

addclass()添加效果

removeclass()移除效果

toggleclass()切换效果

css()返回css属性值

css(,)设置修改css属性值

css(:,:,)设置多个css属性

本文在博客 几何军工作室 首发

https://kfzjw008.github.io

  • 发表于:
  • 原文链接:https://kuaibao.qq.com/s/20181110G102R400?refer=cp_1026
  • 腾讯「云+社区」是腾讯内容开放平台帐号(企鹅号)传播渠道之一,根据《腾讯内容开放平台服务协议》转载发布内容。

扫码关注云+社区

领取腾讯云代金券