文章路径: 全部 / 叶飞 / 源栈培训:ASP.NET全栈开发 / Web前端 / Javascript入门 /

Javascript的基本语法:为能使用JQuery和Bootstrap.js的使用打下基础


更多
2021年06月15日 11点18分 作者:叶飞 修改

mock.js

纯前端的同学,在开始学习Ajax之前,必须掌握:模拟从后台获取数据。我们使用mock.js,感觉是位中国兄弟做的,^_^引入对还没有了解npm的同学们,可以直接引入mock.js的源代码 生成数据直接调用Mock.mock()方法,第一个参数是要请求的url(如果省略该参数,直接返回JSON数据),第二个参数是JSON对象:Mock.mock("/Student/23", {sname: '老程',age: 21,isFemale: true,//......然后,我们就可以使用Ajax请求该url,获取 ……

mock.js
2019年05月12日 15点18分 作者:叶飞 修改

HTML5常用API:地理定位/canvas/多媒体/本地存储/拖放

视频和音频HTML5提供了包含视频/音频的标准方法。在此之前,通常都只能通过插件(flash)实现。<video controls style="width:30%; height:auto" ><source src="/video/拜年啦.mp4" /></video>代码非常清晰简洁。如果不需要显示操作按钮的话,就不需要controls属性<audio id="hit"><source src="/audio/敲打.wav" />< ……

源栈 前端 HTML5
2019年05月11日 15点29分 作者:叶飞 修改

JavaScript:iframe / Ajax / JSON

AsynchronousJavascriptAndXML异步:不刷新页面,不阻碍其他语句执行Javascript:操作语言XMLHttpRequest:核心对象 (JSON => XML)诞生于微软(Outlook Web Access),成名于Google(suggest/map/……)从某种程度上讲,Ajax挽救了JavaScript(干掉了一系列的Rich Internet Application竞争对手:flash/Silverlight……),造就了今天的“大前端”。Ajax的成功,深刻的 ……

源栈 JavaScript Ajax 异步加载
2020年07月11日 22点05分 作者:叶飞 修改

JavaScript:事件:冒泡和捕获机制

一般的事件处理不需要考虑这种情况。但是,这不仅是一个常见面试题,而且有其实际使用场景。演示准备 有父子两个元素<div id="propagate"><p>源栈欢迎您</p></div>为了便于演示,加上一点CSS效果:<style>#propagate {padding: 30px;border: 1px solid;}#propagate > p {background-color: blue;border: 1px dashed;}& ……

JavaScript 事件 冒泡 捕获
2020年02月13日 13点58分 作者:叶飞 修改

JavaScript:事件:常用类型详述

除了click,还有:MouseEvent(鼠标)mouseovermousemovemouseout一个元素可以绑定多个事件复习:重用functionKeyboardEvent(键盘)keydownkeypress:只相应是字符,不响应“非打印”字符keyup演示:输入框检查找到按下的键:document.onkeydown = function (event) {console.log('code:' + event.code + ' key:' + event.key); //keyCode}Fo ……

JavaScript 事件 详述
2019年04月24日 21点54分 作者:叶飞 修改

JavaScript:事件:绑定/this/event

事件(event) 事件是一些可以通过脚本响应的页面动作。源(trigger/target):由谁(不是“用户”而是指DOM元素)触发了事件类型(type):click/keydown/load处理程序(handler):注册(register)/ 绑定(bind):绑定方法 标签中:代码块(注意这个this)<h1 onclick="alert(`源栈欢迎${this.innerHTML}!`)">HTML DOM示范</h1>函数<h1 onclick="greet('l ……

源栈 前度 JavaScript 事件
2019年04月23日 13点56分 作者:叶飞 修改

JavaScript:DOM元素增删改查

DOM(Document Object Model)W3C制定的用于访问结构化(structured)文档的标准。包含:核心DOMXML DOMHTML DOM换言之,HTML DOM 是关于如何获取、修改、添加或删除 HTML 元素的标准。(还是增删改查,^_^) 节点(Node) 在 HTML DOM 中,所有事物都是节点。DOM 是被视为节点“树”的 HTML。整个文档是一个文档节点每个 HTML 元素是元素节点HTML 元素内的文本是文本节点(注意:元素是元素,文本是文本)每个 HTML 属性是 ……

源栈 前度 JavaScript DOM
2019年04月23日 13点55分 作者:叶飞 修改

JavaScript:BOM:window对象 / 导航 / 定时器 / 其他

JavaScript真正的作用:和浏览器及页面的HTML内容交互。BOM全称:Browser Object Model,浏览器对象模型。实质上就是将浏览器视为一个对象(模型),该对象提供了一系列的方法(又称API)供开发人员使用。比如:alert()方法。观察:不同的浏览器调用alert()会有不同的呈现效果,这就是因为alert()的实现效果是由浏览器决定的原因。 目前BOM还没有统一的标准(所以有浏览器兼容性问题),但常用的大部分对象/方法/属性都是相同的。window对象alert()实际上也是wi ……

源栈 前端 JavaScript BOM
2021年01月14日 12点05分 作者:叶飞 修改

JavaScript:内置类和方法:字符串 / 正则

字符串字符串可以理解为由单个字符组成的数组。所以它可以像数组一样使用:属性:length下标[]:(从0开始)但是,注意:字符串是“不可更改(imutable)”的,所以str[3]='x'无效,同样的,以下所有字符串方法都不会修改原字符串,而是返回一个新字符串。以下方法皆通过字符串对象调用,是实例方法:toUpperCase()/toLowerCase():转换为大写/小写,主要用于忽略大小写的比较(先转换再比较)if(str.toLowerCase() == 'feige'){ indexOf(tar ……

Javascript 字符串 正则
2019年04月26日 14点58分 作者:叶飞 修改

JavaScript:内置:包装 / 数组 / Math / Date

类和对象之前我们学习过用花括号({})可以生成生成一个匿名类对象。实际上,按“面向对象”的观点,对象是类的实例:类(型):抽象概念,比如:人对象:具体实例,比如,张三张三 这个 对象 就是 人 的 实例(实际的例子)。所以要有对象必须先有类。(参考:)匿名类对象,就是一个没有类名的对象。JavaScript号称是一个“面向对象”的语言,还是提供了很多内置的类型的。包装类之前我们学过的所有primitive类型,都有对应的类的:String / Number / Boolean / Array(数组),注 ……

JavaScript 对象 面向对象

Web前端


HTML和CSS

HTML最常用的标签和属性,含HTML5的语义标签和新属性,但不包含需要JavaScript操作的HTML5 API,以及CSS基础(简述CSS 3动画相关),以及bootstrap.js以外的Bootstrap的内容。

Javascript入门

Javascript的基本语法:为能使用JQuery和Bootstrap.js的使用打下基础

ES进阶

借助于ES6,讲解JavaScript中一些更复杂的语法特性,如作用域、闭包、面向对象、原型链、this变化、module等

Bootstrap和JQuery

CSS框架Bootstrap,和JavaScript的JQuery类库(含Ajax)

Vue.js

全部
关键字



帮助

反馈