这个题很简单的,就是用一个按钮切换二个菜单的显示和隐藏。比昨晚的查找重复字符串要简单的多。...参与写作业的同学们基本都写的不错,思路也都OK,用原生JS,jQuery,ES6都可以,, 暴露出来的问题主要有二个, 一是DOM查找的效率问题,这个大家自己其实都懂,我就提一下不多说了哈,, 二是判断条件的选择
首先我们马上问道的小伙伴我们这个网页也需要它有什么作用呢?我们学网页肯定是有些网页的一个作用的,那么大家看到的现在的很多的网页,在Windows系统上面我们使用...
底部选项卡tab有两种实现方式,一种是用js另一种是原生的 一、js实现方式:首先先建1个首页和几个子页,最后合并而成 ? <!...wvs.length); var sub = plus.webview.create( subpages[i], //子页...url subpages[i], //子页id {...bottom: "50px" } ); //如不是我们设置的默认子页则隐藏...里面的util.js 把i<8 改成 i<6 for(var i = 0; i < 8; i++) { if(i !
js对象和jq对象互相转换:(js对象和jq对象不是一个东西,不能互相调用彼此的方法,有些时候只能的js对象但是需要用到jq框架里面的方法这时候就需要使用以下方式将js对象转成jq,同理有时只能得到jq...对象但是需要调用js对象里面的方法,所以需要使用以下方法把jq对象转成js对象) //js获取对象的方式 var js = document.getElementById(“d1”); //jq获取对象的方式...”) 匹配div里面所有的span(包括所有后代span) $(“div>span”) 匹配div里面所有的span子元素 $(“div+span”) 匹配div后面的span $(“div~span”...相关方法: 显示.show() 隐藏 .hide() 显示隐藏切换 .toggle() ---- 练习: 1.定时器 //通过id选择器选择到页面中的div然后修改里面的文本为abc $("#d1").text("abc"); //原生js写法 /* var d1 = document.getElementById
详情页返回列表页缓存数据和浏览位置、其他页面进入列表页刷新数据的实践 这样一个场景:有三个页面,首页/或者搜索页,商品分类页面,商品详情页。...如果数据请求成功,则加载内容的组件,隐藏其他组件。如果是列表页,可能在内容组件中还会有列表和为空提示两块内容,所以这时候也还要根据获取的数据来判断是加载内容还是加载为空提示。...全局的页面顶部进度条,可以在main.js中通过router.beforeEach(to, from, next) {}来设置,当页面路由变化时,显示页面顶部的进度条,进入新路由后隐藏掉进度条 ?...,控制其隐藏的代码是写在组件里面的,当组件隐藏了对应的也要父组件对应的值改变 以上这种方式实现的父子组件的v-model通信,虽可行,但限制了我们必须popos接收的属性名为value和emit触发的必须为...下面直接上index.js吧,而后在简单介绍: import Vue from 'vue' import Router from 'vue-router' // 公共页面的路由文件 import PUBLIC
导航高亮 导航高亮是一种很常见的问题,包括当前页面的导航在菜单里面高亮和hover时高亮。你可以用js控制,但是用一点CSS技巧就可以达到这个目的,不需要使用JS。...鼠标悬浮时显示 鼠标悬浮的场景十分常见,例如导航的菜单: 以及在《Google地图开发总结》一文提到的,marker详情框的显示: 一般要把隐藏的东西如菜单作为hover目标的子元素或者相邻元素,才方便用...第二种场景,使用子元素,这个更简单。...把hover的目标和隐藏的对象当作同一个父容器的子元素,然后hover写在这个父容器上面就可以了,不用像上面那样,隐藏元素也要写个hover: .marker-container .detail-info...多列等高 多列等高的问题是这样的,排成一行的几列由于内容长短不一致,导致容器的高度不一致: 你可以用js算一下,以最高的一列的高度去设置所有列的高度,然而这个会造成页面闪动,刚开始打开页面的时候高度不一致
导航高亮 导航高亮是一种很常见的问题,包括当前页面的导航在菜单里面高亮和hover时高亮。你可以用js控制,但是用一点CSS技巧就可以达到这个目的,不需要使用JS。 ? ?...一般要把隐藏的东西如菜单作为hover目标的子元素或者相邻元素,才方便用css控制,例如上面的菜单,是把menu当作导航的一个相邻元素: 用户<li class...第二种场景,使用子元素,这个更简单。...把hover的目标和隐藏的对象当作同一个父容器的子元素,然后hover写在这个父容器上面就可以了,不用像上面那样,隐藏元素也要写个hover: .marker-container .detail-info...你可以用js算一下,以最高的一列的高度去设置所有列的高度,然而这个会造成页面闪动,刚开始打开页面的时候高度不一致,然后发现突然又对齐了。
一、概述 vue-router是Vue.js官方的路由插件,它和vue.js是深度集成的,适合用于构建单页面应用。...客户端中的路由,实际上就是dom 元素的显示和隐藏。当页面中显示home 内容的时候,about 中的内容全部隐藏,反之也是一样。...2.1 一个简单的单页应用 直接来看一个demo: //1.创建组件 var Home = Vue.extend({ template: '' +...我们把上面的Demo简单修改一下:html页面不动,只是简单改一些js的部分 var Home = Vue.extend({ template: '' +
简要教程 pushbar.js是一款带模糊效果的js隐藏滑动侧边栏插件。pushbar.js能制作上下左右四个方向的滑动侧边栏效果,并且在侧边栏菜单显示的时候,主页面会带有炫酷的模糊特效。...隐藏滑动侧边栏菜单的HTML结构如下: js带模糊效果的隐藏滑动侧边栏插件 Tiny javascript...target="_blank"> 返回下载页 初始化插件 在页面DOM元素加载完毕之后,通过下面的方法来初始化pushbar.js插件。
准确地说,只要页面的可见性状态发生变化,无论是用户最小化、最大化窗口还是切换标签页,该API都会触发一个事件。 在过去,你不得不使用一些噱头来了解用户是否切换了标签页或最小化了窗口。...所以,blur和focus只告诉我们页面是否被激活,但不告诉我们页面的内容是否被隐藏或显示。 什么时候使用 一般来说,我们想要使用Page Visibility API,是希望用来停止不必要的程序。...当访问该属性时,会根据页面的可见性状态返回四个可能的值: visible:该页面是可见的,或者准确地说,它没有被最小化,也不在另一个标签页。.../yoshi.mp4" /> 回到/main.js,我们使用Fetch API[4]发起对quotable.io...Quote 前往/main.js从DOM中选择分享按钮。
源码介绍: 这是一款基于vuejs的鼠标悬停动物显示和隐藏动画特效。该特效使用vuejs来编写,在鼠标悬停到卡片上面时,会有一只指定的小狗从卡片下冒出来,非常炫酷和可爱。 演示截图: ? ?.../style.css"> 引入JS: HTML部分: 基于vuejs的鼠标悬停动物显示和隐藏动画特效 Mochi Shiba (vuejs, svg, css, cute) 返回下载页 MOCHISHIBA.../p>
//timeArr数组与数据就渲染下面的...值 6.父-> 子 父组件: dom: js: courseList().then(res =>...courseList: { type: Array } } 总结套路:父组件将变量传到子组件,需要在子组件标签上绑定这个变量,然后子组件就可以在props 里接受这个变量 7....错误路由的处理,重定向, 在router里添加一个路由信息 { path: '*', redirect: '/' } 这里是重新定向到首页,也可以单独做一个 404页面,重定向到这个页面... 说到底还是控制dom 显示和隐藏的方法。
p") 包含选择器 div中所有的p 子元素 子子元素.. ...$("div > p") 子后代选择器 div中直接子后代 $("div + p")第一个兄弟p 简单选择器 :first 选取第一个元素 $("div:first")...=test]")选取title属性不为test的元素 兄弟节点,子节点 .siblings()所有兄弟节点。...height(); 第四部分,动画 复杂动画可以解决其它动画实现的效果,所以个人觉得,只须记住复杂动画就可以了 show()、hide() toggle() 切换显示隐藏.../js/jquery.easyui.min.js" type="text/javascript"> <script src="../..
--当有子菜单时显示div--> {pboot:2nav parent=[nav:scode]} [2nav:name] {/pboot:nav} 3....} 下一页 尾页 {else} 暂无内容[nav:name] {pboot:if([nav:i]==3)} {/pboot:if} {/pboot:nav} 上面的的
如果数据请求成功,则加载内容的组件,隐藏其他组件。如果是列表页,可能在内容组件中还会有列表和为空提示两块内容,所以这时候也还要根据获取的数据来判断是加载内容还是加载为空提示。...全局的页面顶部进度条,可以在main.js中通过router.beforeEach(to, from, next) {}来设置,当页面路由变化时,显示页面顶部的进度条,进入新路由后隐藏掉进度条。 ?...,因为你要在页面内进行某些操作将他显示出来,控制其隐藏的代码是写在组件里面的,当组件隐藏了对应的也要父组件对应的值改变。...子组件写法: 确定 // model选项用来避免冲突 // prop属性用来指定props属性中的哪个值用来接收父组件...下面直接上index.js吧,而后在简单介绍: import Vue from 'vue' import Router from 'vue-router' // 公共页面的路由文件 import PUBLIC
再看看效果: 然后我们再改一下颜色,当我们之后改动各个页面的各种元素的时候,一定要记得,要符合你整个平台的颜色风格,比如我之前登陆页面 是 绿色+红色。 我的首页是绿色+黑色。...内部元素只有一个空格占位,颜色是从上到下渐变,位置是固定的 让我们在body内继续新建一个div。 注意到里面有个空格,空格的写法是 别写错,别忘了后面的分号。...如果不写这个空格,那么你这个div 就是被强制隐藏的。 然后我给它加上一堆css属性。...我们对每段说明都 放在了一个子span中,以便我们后续控制显示/隐藏,不同的span 的id也不同,分别是help_1 ~ 5 好,按照我们的设计呢,用户一进来时候,右侧只显示第一条文档:项目列表...所以我们要给上述中 第2/3/4/5的span 的属性变成隐藏:style:"disaplay:none" 文案较多,大家可以直接复制以下这个div代码哈: <div style="position:
数值在0-150之间)(暂无介绍…)就是自定义内容{$field.seo_description|html_msubstr=###,0,30,true|default='暂无介绍…'}----9、判断有无子栏目判断有无子栏目...-- 有子栏目时显示的内容 -->{eyou:else /}内容{/eq}如果判断主语言隐藏,其他语言显示...{$Request.rootDomain}__ROOT_DIR__ 代表域名不带.www 头的 只有 eyoucms.com 这样的格式----20、大部分浏览器隐藏video视频播放器下载按钮功能打开你的视频内容页的模板文件...-描述:还提供了两个标签别名 js 、css、import 用法和 load 一致{eyou:js file='/static/js/common.js' /}{eyou:css file='/static
这与 Angular.js 之类的框架相反,后者要求将现有程序完全重构并在该框架中实现。 2. Vue.js 中的声明式渲染是什么? Vue.js 使渲染数据变得容易,并隐藏了内部实现。...div 中输出字符串 Vue.js。...这种绑定始终是单向的,这意味着数据可以从父组件流到子组件,而绝不会反过来。 8. Vue.js 中的指令是什么?...如何将数据从父组件传递到子组件? 可以用作为组件中单向入口的 prop 把数据向下传递到子组件。...另一方面,当与现代工具和支持库结合使用时,Vue也完全能够为复杂的单页应用程序提供支持。
hide()隐藏内容 show() 显示 toggle() 一下显示一下隐藏 括号中如果有参数,填数字(单位是毫秒),那么会有动画效果,如果不填,没有动画效果。 对比js和jq: 按钮 <...() .prevAll() 选中某个属性 = 某个值的标签,只要键值对存在 $('img[alt=aa]').css('background','green') 下面的环境都是父子集 has选中了谁的子级是...class="box1"> box1里面的p has box2里面的p find...) mouseout()鼠标离开(离开子元素也触发) mouseenter()鼠标进入(进入子元素不触发) mouseleave()鼠标离开(离开子元素不触发) 上面的这些鼠标移入和离开,触发和不触发指的是不再次触发父级
领取专属 10元无门槛券
手把手带您无忧上云