JS思想

能从宏观上把握程序

onclick:单击时触发事件

onmouseover:鼠标进入时触发事件

onmouseout:鼠标离开时触发事件

事件三要素:最基础的内容

事件源:有监听的HTML 标签,能响应事件的HTML 标签,就是事件源。

事件名:用户的特定行为,比如onclick

事件的响应:就是一个个function

通过ID来获得元素;通过Class来获得元素。

导航菜单:对选项添加鼠标进出事件。

display为none的元素隐藏且会让出自己的位置。

visibility为hidden的元素隐藏但是不让出自己的位置

完成之后的效果

关于定位:用position,口诀:”子绝父相“

JS编程必须要先布局,布局稳定了在做下一步。

水平菜单

1) 脱标,留在原地。position:absolute ,不写top 值,可以写left 值来调整位置。

2) 空档一定是父盒子的padding,而不能是子盒子的margin

3) 监听一定是在li 身上,而不能是a 身上

4) 要学会用class“避讳样式”——我们的后代选择器有点不好用,所以就要给不同的li 加上不同的class

区分即可,通过class 来添加样式

5) 不要过分的追求所谓优雅的代码

时间: 2024-10-05 12:56:18

JS思想的相关文章

有jQuery背景,该如何用AngularJS编程思想?

"我可以熟练使用jQuery进行客户端应用的开发,但是现在我希望开始使用Angular.js.哪位能描述一下这个过程中必要的模式变化吗?希望您的答案能够围绕下面这些具体的问题: 1. 我如何对客户端web应用进行不同方式的架构和设计?它们之间最大的区别是什么?(译者注:指jQuery和Angular.js) 2. 有什么是我不该做或者不该使用的:而又有什么是我应该做或者应该使用的呢? 3. 有没有一些服务端的考量/约束呢? 我在寻找的就是一个关于jQuery和Angular.js之间的详细的比较

会jQuery,该如何用AngularJS编程思想?

我可以熟练使用jQuery进行客户端应用的开发,但是现在我希望开始使用Angular.js.哪位能描述一下这个过程中必要的模式变化吗?希望您的答案能够围绕下面这些具体的问题: 1. 我如何对客户端web应用进行不同方式的架构和设计?它们之间最大的区别是什么?(译者注:指jQuery和Angular.js) 2. 有什么是我不该做或者不该使用的:而又有什么是我应该做或者应该使用的呢? 3. 有没有一些服务端的考量/约束呢? 我在寻找的就是一个关于jQuery和Angular.js之间的详细的比较.

一个程序猿的正常心态

1 不能遇到问题想办法逃避,要想明白这个问题为什么出现,如何避免 2 不能遇到问题总寄托于别人,想让别人来帮你解决 3 可以跟别人沟通自己的想法,但是自己没有主见 4 代码终究只是代码,大不了回滚,不要畏惧. 5 测试要用心,遇到问题不能能过且过. 6 不能对代码产生恐惧感,先看函数,再看变量,最后分析一下执行顺序,没什么大不了 这两天学了很多东西: 1 不要完事求方法 2 chrome的断电测试方法 3 快速查看函数执行顺序 4 变量调用方法规则 5 轻微JS思想

2019.12.19----今天学了啥?

之所以新建这个分类是因为昨天参加了 <极客时间>的 21天学习行动,就萌生了这个想法来督促自己.写的很随意简单,不占用自己太多时间跟精力. 今天学了啥? 一.早 6:50 -- 7:30 极客时间  <玩转webpack> 10.11讲.其实一直想比较全面的过一遍官网文档,记得刚转前端的时候粗略看过一遍,那时候因为还太菜,所以看完一直没太深影响,在工作中有时候开发会觉得打包效率很低,但是呢这部分又是由我们公司能力比较强一个同事在负责,所以自己现在也想深入研究一遍,能把公司的webp

vue.js学习笔记(一):什么是mvvm框架,vue.js的核心思想

一:MVVM框架 MVVM框架的应用场景:  1.针对具有复杂交互逻辑的前端应用 2.提供基础的架构抽象 3.提供ajax数据持久化,保证前端用户体验 二:vue.js的核心思想 (一):数据驱动 (二):数据响应原理 (三):组件化 (四)组件设计原则 1:页面上每个独立的可视/可交互区域视为一个组件 2:每个组件对应一个工程目录,组件所需要的各种资源在这个目录下就近维护 3:页面只不过是组件的容器,组件可以嵌套自由组合形成完整的页面

拖拽系列二、利用JS面向对象OOP思想实现拖拽封装

接着上一篇拖拽系列一.JavaScript实现简单的拖拽效果这一篇博客将接着对上一节实现代码利用JS面向对象(OOP)思维对上一节代码进行封装; 使其模块化.避免全局函数污染.方便后期维护和调用:写到这里突然想起一句话“没有任何一个题目是彻底完成的.总还会有很多事情可做......” 我想这句话程序开发大概也适用吧,前端开发人员总是可以结合自己之前学到“拖拽”相关知识,不断扩展.完善.无穷无尽.......     利用匿名函数自执行实现封装 ;(function(){ //do somethi

原生JS面向对象思想封装轮播图组件

原生JS面向对象思想封装轮播图组件 在前端页面开发过程中,页面中的轮播图特效很常见,因此我就想封装一个自己的原生JS的轮播图组件.有了这个需求就开始着手准备了,代码当然是以简洁为目标,轮播图的各个功能实现都分别分为不同的模块.目前我封装的这个版本还不适配移动端,只适配PC端. 主要的功能有:自动轮播,点击某一张图片对应的小圆点就跳转到指定图片,有前后切换按钮.使用的时候只需要传入图片的路径以及每张图片分别所对应的跳转路径还有目标盒子ID就可以了,还可以自定义每张图轮播的延时,不过延时参数不是必须

作用域 作用域链 闭包 思想 JS/C++比较

首先,我说的比较是指JS中这种思想/实现方式与C++编译原理中思想/实现方式的比较 参考链接:(比较易懂的介绍,我主要写个人理解) 作用域链: http://www.cnblogs.com/dolphinX/p/3280876.html 闭包:http://kb.cnblogs.com/page/110782/ 个人理解: 作用域链: 在JS中,function也是一种object的实例. 作用域的概念必须已经知晓. 作用域链:用于标识符解析:确定数据的存储位置以及数据作用域(数据访问).(应该

js学习总结----ajax兼容处理及惰性思想

封装代码如下: // var xhr = null; // //为了兼容IE6及更低的版本:如果第一个不支持,则浏览器会报错,后面就不在执行了 // try{ // xhr = new ActiveXObject("Microsoft.XMLHTTP"); // }catch(e){ // } // if(new ActiveXObject("Microsoft.XMLHTTP")){ // xhr = new ActiveXObject("Microso