网站建设、公众号开发、微网站、微商城、小程序就找牛创网络 !

7*24小时服务专线: 152-150-65-006 023-68263070 扫描二维码加我微信 在线QQ

前端开发技术团结互助,让我们共同进步!

当前位置:主页 > 技术资讯 > 开发技术 > 前端开发技术 >

我们的优势: 10年相关行业经验,专业设计师量身定制 设计师一对一服务模式,上百家客户案例! 企业保证,正规流程,正规合作 7*24小时在线服务,售后无忧

智能社高级javascript教程大纲之初探JavaScript魅力

文章来源:重庆网站建设 发布时间:2019-05-22 14:30:39 围观次数:
分享到:

摘要:javascript初探,网页特效原理,javascipt样式修改。

JavaScript是什么

l网页特效原理 

l淘宝、新浪、百度 

lJavaScript就是修改样 l 

l编写JS的流程 

l布局:HTML+CSS 

l属性:确定要修改哪些属性 

l事件:确定用户做哪些操作(产品设计) 

l编写JS:在事件中,用JS来修改页面元素的样式

第一个JS特效——鼠标提示框

l分析效果实现原理 

l样式:divdisplay 

l事件:onmouseoveronmouseout 

l动手编写此效果 

l特效基础 

l事件驱动:onmouseover 

l元素属性操作:obj.style.[……] 

l特效实现原理概括:响应用户操作,对页面元素(标签)进行某种修改

初识函数

l制作更复杂的效果(DIV的颜色、大小都变化) 

l直接在事件内写代码会很乱 

l引入fucntion()、函数的基本形式 

lJS从标签里放入到函数里,类似css里的class 

l变量的使用——别名 

l定义和调用 

l函数定义:只是告诉系统有这个函数,不会实际执行 

l函数调用:真正执行函数里的代码 

l关系和区别

getElementById

l第一个JS兼容性问题 

lFF下直接使用ID存在问题 

l引入document.getElementById() ldocument.getElementById在任何浏览器下均可使用 

l网页换肤 

l土豆网“开灯、关灯”效果 

l任何标签都可以加ID,包括link 

l任何标签的任何属性,也都可以修改 

lHTML里怎么写,JS里就怎么写

if判断

l点击按钮显示/隐藏Div (弹出菜单) 

l特效实现过程及原理分析 

lif的基本形式 

l扩展 

la链接添加JS 

l<a href=“javascript:;”></a> 

lclassName的使用

函数传参

l改变背景颜色 

l函数传参:参数就是占位符 

l什么时候用传参——函数里定不下来的东西 

l改变Div的任意样式 

l操纵属性的第二种方式 

l什么时候用:要修改的属性不固定 

l字符串和变量——区别和关系 

l将属性名作为参数传递 

lstyleclassName 

l元素.style.属性=xxx 是修改行间样式 之后再修改className不会有效果

提取行间事件

l提取事件 

l为元素添加事件 

l事件和其他属性一样,可以用JS添加 

lwindow.onload的意义 

l行为、样式、结构三者分离 

l获取一组元素 

lgetElementsByTagName 

l数组的使用 里面的

循环

lwhile引入循环的概念 

lwhile循环语法 

l自增的意义 

l循环的构成:初始化、条件、语句、自增 

lfor循环 

lfor代替while循环 

lfor循环为一组元素添加事件 

l什么时候用循环——一组元素 

l例子 

l全选——checked属性 

l反选——for循环配合if判断

选项卡

l按钮的实现 

l添加事件 

lthis的使用 

l先清空所有按钮,再选中当前按 l 

l内容的实现(div) 

l先隐藏所有Div,再显示”当前”Div 

l索引值的使用 

l什么时候用索引值——需要知道“第几个”的时候 

lhtml添加index——会被FF过滤 

ljs添加index

JS简易日历

l程序实现思路 

l类似选项卡,只是下面只有一个div 

linnerHTML的使用 

l数组的使用 

l定义:arr=[1,2,3] 

l使用:arr[0] 

l字符串连接 

l作用:连接两个字符串 问题:连接中的优先级

涪陵网站建设找牛创网络

本文由 重庆网站建设 整理发布,转载请保留出处,内容部分来自于互联网,如有侵权请联系我们删除。

相关热词搜索:智能社 javascript 教程大纲 涪陵网站建设

上一篇:前端开发技术之ES6入门摘录笔记(二)
下一篇:智能社JAVASCRIPT高级教程之-JavaScript基础大纲

热门资讯

鼠标向下滚动