网页上的空间是寸土寸金，虽然显示器的分辨率越来越大，可是直到今天，网页设计中仍然是以至少1024×768 像素的支持为主，也就是说，每一屏页面只有区区 955×600像素 的安全尺寸可以用而已。...于是，为了在有限的空间里容纳更多的内容，滑动门式的标签切换（Tabs）方式越来越受欢迎。通过滑动门技术，可以在同一块页面区域内放置数倍的内容。根据用户的选择来决定显示哪一部分。...最早的滑动门的技术，一般都是结合 onclick 或者 onmouseover 事件传递一个参数给 JS 函数，根据传递的参数来决定显示哪一个标签。...而且，这种方式来带来另一个麻烦，就是当我们需要给标签加上链接的时候，没办法加。即使你将标签的激活事件设置为 onmouseover 而不是 onclick, 链接也不能实现，因为链接用于指定目标了。...在实际使用中，会遇到一个问题，一般我们会给 tab 中的文字加链接，那么当鼠标滑过这个 tab 的时候，如果指到了文字，那么激发事件的对象有可能是 A 元素而不是 LI 元素，则事件就不能正确激发。
路由传参小 Tips 在实际开发中，往往在页面切换时需要传递一些参数，有些参数适合放在 Redux 中作为全局数据，或者通过上下文传递，比如业务的一些共享数据，但有些参数则适合放在 URL 中传递，比如页面类型或详情页中单据的唯一标识...在处理 URL 时，除了问号带参数的方式，React-Router 能帮我们做什么呢？在这其中，Route 组件的 path 属性便可用于指定路由的匹配规则。...场景 1 描述：就想让普普通通的 URL 带个平平无奇的参数 那么，接下来我们可以这样干： Case A：路由参数 path="/book/:id" 我们可以用冒号 + 参数名字的方式，将想要传递的参数添加到...其一是在 Link 组件的 to 参数中通过配置字符串并用问号带参数，其二是 to 参数可以接受一个对象，其中可以在 search 字段中配置想要传递的参数。 用 div 包裹是因为 Router 下只能有一个元素），输入 /router/book 则影像和图书都会被渲染出来，如果想要只精确渲染其中一个，则需要 Switch <Route
路由传参小 Tips 在实际开发中，往往在页面切换时需要传递一些参数，有些参数适合放在 Redux 中作为全局数据，或者通过上下文传递，比如业务的一些共享数据，但有些参数则适合放在 URL 中传递，比如页面类型或详情页中单据的唯一标识...在处理 URL 时，除了问号带参数的方式，React-Router 能帮我们做什么呢？在这其中，Route 组件的 path 属性便可用于指定路由的匹配规则。...场景 1 描述：就想让普普通通的 URL 带个平平无奇的参数 那么，接下来我们可以这样干： Case A：路由参数 path="/book/:id" 我们可以用冒号 + 参数名字的方式，将想要传递的参数添加到...其一是在 Link 组件的 to 参数中通过配置字符串并用问号带参数，其二是 to 参数可以接受一个对象，其中可以在 search 字段中配置想要传递的参数。 div> 如果 是平铺的（用 div 包裹是因为 Router 下只能有一个元素），输入 /router/book 则影像和图书都会被渲染出来，如果想要只精确渲染其中一个
这个 dictionary就是命名空间，用来声明我们模块内自己使用的所有类和变量。 2）类 JavaScript 不像其他面向对象编程语言那样有类机制。...要想显示些内容，我们用 jQuery 该对象上的一些简单方法，在根标签中添加一些 HTML 标签： instance.oepetstore.HomePage = instance.web.Widget.extend...如果函数像对象引用方法那么用，通过 this 我们知道当前的对象是什么。每个已声明的函数都有自己的 this。...如果func是个方法，则object是func函数的引用关联对象。当func被调用时，trigger()的其他参数会传递给它。...这就是为什么，大部分时间里，你在定位部件里的 HTML 时，必须限制 jQuery 选择器的选择范围。 出于同样的逻辑，你也可以猜测到，不能够在部件里使用 HTML id。
我们使用术语jQuery包装器或者包装集(wrapped set)，来指能够在其上用jQuery定义的方法去操作的、匹配元素的集合。...因为类样式的可重用，所以多个元素可以引用同一个样式。...在jQuery中，可以获取同一类名的多个HTML元素，编写方式同CSS，即在类名的前面加上点号。...语法：$(".className") 本例通过类名来获取元素，因为使用同一个类样式的元素可能有多个，所以通过类名来获取元素返回的将是一个数组对象，即jQuery中的包装集，然后对此包装集中的元素进行相关操作...因为在服务器和浏览器之间交换的数据大量减少，结果我们就能看到响应速度更快的应用。同时很多的处理工作可以在发出请求的客户端机器上完成，Web服务的处理时间也就减少了。 ?
“$()”等价于“jQuery()”，即jQuery的构造函数，为该构造函数传递一个元素，就可以创建出一个元素对象。...jQuery对象内部有3个元素。 下标为0的元素表示其内部的DOM对象，即document对象。 length表示其内部DOM对象的个数，一个jQuery对象中可以包装多个DOM对象。...，必须包含left和top属性 css()方法中传递的参数若是对象，则需要去掉CSS属性中的“-”，将第2个单词的首字母变为大写。...，如果有，则返回true is(expr) 用一个表达式来检查当前选择的元素集合，如果其中至少有一个元素符合这个给定的表达式就返回true has(expr) 保留包含特定后代的元素，去掉那些不含有指定后代的元素...参数selector表示选择器。 参数data表示将要传递给事件处理函数function的数据。 参数type表示为元素添加的事件类型（多个用空格分隔）。
以后还会持续更新，有些题目有多种答案，本文只给出其中一种，哪里有问题的欢迎指出。...GET：一般用于信息获取，使用URL传递参数，对所发送信息的数量也有限制，一般在2000个字符 POST：一般用于修改服务器上的资源，对所发送的信息没有限制。...可以像普通dom一样操作，但是因为表格的dom比较复杂，所以我通常是使用table的insertRow、deleteRow及tr对象的insetCell、deleteCell操作。...因为它涉及浏览器兼容、跨域等问题，在项目中一般会使用一些基础类库辅助实现，如jQuery等。 一个简单的Ajax操作如下。 5、谈谈你对JSON的理解。...①原型对象也是普通的对象，是对象一个自带隐式的 proto 属性，原型也有可能有自己的原型，如果一个原型对象的原型不为null的话，我们就称之为原型链。
例如点击一个按钮，向一个div追加5条记录，那么下一次点击按钮，又会调用一次ajax请求，向里面追击五条与先前重复的记录，因此每一次在追加之前，需要先将之前追加的记录或者追加的标签属性清除 jquery...click的原因是因为，发送ajax请求动态往标签体内增加内容是在页面加载完成以后做的 //修改员工 //1.我们是按钮创建之前就绑定了click，所以绑定不上事件 //2.1....$.ajax({ //这里把员工id传递到更新按钮上，这样这里的id参数就可以直接从按钮上获得 url:"${ctx}/emp/"...//此处不能直接绑定click的原因是因为，发送ajax请求动态往标签体内增加内容是在页面加载完成以后做的 //如果单个选择框当前页全部选满了，那么最大的选择框也会被选中 $(document...ajax时，又会重复上一次的追加行为，那么页面效果就是内容重复追加，解决办法就是在每次调用ajax之前，先将之前重复追加的内容清除掉 同理如果ajax是追加或者修改了标签的属性，那么对应的被更改的属性就会一直存在
在这个配置中，我们可以指定使用的预处理器以及其配置选项。其中，scss 是一种流行的 CSS 预处理器。...Object.assign 中第一个参数的 {} 表示我们正在创建一个新的空对象，该对象将用作目标对象。...，子组件名用逗号分隔 page-sizes 每页显示个数选择器的选项设置 popper-class 每页显示个数选择器的下拉框类名 prev-text 替代图标显示的上一页文字 prev-icon 上一页的图标...然后我们调用 withDefaults 函数，将其作为第一个参数传递，并将一个新的选项对象作为第二个参数传递。...) // 取消导航并停留在同一页面上 if (!
$ 可以用jQuery来代替，相当于原生js中的window 1.1.3 jQuery 对象和 DOM 对象 用原生 JS 获取来的对象是 DOM 对象 jQuery 方法获取的元素是 jQuery 对象...’*"’) 匹配所有元素 类选择器 $(".class") 获取同一类class的元素 标签选择器 $(“div”) 获取同一类标签的所有元素 并集选择器 $(“div,p,li”) 选取多个元素 交集选择器...3.切换类 $("div").toggleClass("current"); 在原生js中className会覆盖类名，在jQuery中指操作指定类名，不影响原先的类名 3.2 jQuery效果...停止动画排队：stop() ; 这样就可以在动画执行的时候停止动画 3.2.1 显示隐藏 显示隐藏：show() / hide() / toggle() ; 关于参数 参数都可以省略，无动画直接显示...> 3.2.4 自定义动画 自定义动画：animate() ; 第一个参数传入更改的样式属性,以对象形式传递，注意复合属性用驼峰命名,后面3个参数可以省略 $(function
它还在，只是为了确保你的插件不与其它使用 $ 的库发生冲突，有一个最佳实践： 把 jQuery 传递给 IIFE（立即调用函数），并通过它映射成 $ ，这样就避免了在执行的作用域里被其它库所覆盖。...现在，在此闭包内我们可以随意用 $ 替换 jQuery。 上下文 现在，已经有了外壳，可以开始编写真正的插件代码了。但在这之前，关于上下文我有话要说。...在插件函数的立即作用域中，关键字 this 指向调用插件的 jQuery 对象。这是个经常出错的地方，因为有些情况下 jQuery 接受一个回调函数，此时 this 指向原生的 DOM 元素。...因此，若插件无需真正的返回值，你应该一直在插件函数的立即作用域中返回 this 关键字。同样，如你所想，调用插件时的参数会被传递到插件函数的立即作用域中。...名称空间 合理地为插件定义名称空间是插件开发中很重要的一部分。 正确的定义名称空间可以确保你的插件很难被其它插件或同一页面中的其它代码所覆盖。
全局布局组件 上面的Mylayout布局组件在主页,教师页和学生页等每个页面都引入了一次,有没有办法全局一次引入呢?...Link组件路由参数传递和获取的方法 现在需求是老师渲染列表页面点击某位老师要进入详情页面并把id以参数方式传递过去....; 准备一个老师的详情页面,引入withRouter高阶组件,在withRouter()方法里将组件传递过去,然后在props.router.query.id里得到传递过来的参数(重要:withRouter...使用浅层路由优化路径显示 上面教师详情页显示路径如下 但路径不好看,我们怎么实现teacher/3这样简洁呢?...注意：getInitialProps 不能 在子组件上使用，只能使用在pages文件夹的页面中进行调用。
因此给他传入的参数不同，效果也是不一样的： 如果参数传递的是一个匿名函数，那么就是入口函数 如果传递的是一个字符串，那么可能是选择器/创建一个标签 如果参数是一个dom对象，那他就会把dom对象转换成JQuery...对象 dom对象和JQuery对象 dom对象：原生js选择器获取到的对象 只能调用dom方法或者属性，不能调用JQuery的属性或者方法 JQuery对象：利用JQuery选择器获取到的对象 只能调用...JQuery的方法或者属性，不能调用原生jsdom对象的属性或者方法 JQuery对象是一个伪数组，JQuery对象其实就是dom对象的一个包装集 dom对象转换成JQuery对象 // 其中...$('li:even') 筛选选择器 是一系列方法 事件 mouseover mouseover事件在鼠标移动到选取的元素及其子元素上时触发 mouseseenter mouseseenter事件只在鼠标移动到选取的元素上时触发...(类名) 节点操作 使用html()和$() // 无参数，获取到元素的所有内容 html() // 有参数，可以覆盖原有的内容 html("") // html()可以解析标签 // 使用$()函数创建元素
= jQuery('div') 其中 $ 和 jQuery 等价 其中Jquery为工厂函数，将会返回一个新创建的对象。...ps 在这种情况下，不能使用纯文本，因为jQuery会将纯文本当成选择器解析。...必须为html标签，还需有一个尖角括号 通过这种方式调用，将会接受第二可选参数，传递Document对象指定与所创建元素相关联的文档。...即全局jQuery对象 对象 jQuery对象有jQuery函数返回的对象，一个jQuery对象表示一组文档元素，即jQuery集，包装集，jQuery结果 选中元素 传递css选择器给jQuery函数时...设置新的滚动条的位置 } 获取和设置元素的位置高宽 $('div').data('x', 1); // 此不在DOM上显示，会直接作为属性附上 $('div').removeData('x'); //
//DOM加载完成的入口 }) jQuery的顶级对象：$ `是jQuery 别称，在代码中`和jQuery和等价，为了方便都是$。...('div').hide(); }); jQuery对象和DOM对象 用原生js获取来的对象是DOM对象，用jQuery方法获取过来的对象是jQuery对象。...因此 jQuery 给我们做了封装，使获取元素统一标准。...//（3）fn:回调函数，在动画完成时执行的函数，每个元素执行一次 hide([speed,[easing],[fn]]);//中括号表示可以省略此参数，无动画直接显示 3.切换显示和隐藏 toggle...---- jQuery 元素操作 遍历元素 jQuery 隐式迭代只能对同一类元素进行相同操作。
因此我们已经声明“hilight”为jQuery的属性对象，任何其他的属性或者函数我们需要暴露出来的，都可以在"hilight" 函数中被声明属性。稍后继续。...2.2 接受options参数以控制插件的行为 让我们为我们的插件添加功能指定前景色和背景色的功能。我们也许会让选项像一个options对象传递给插件函数。...一个真实的例子是Cycle插件.这个Cycle插件是一个滑动显示插件，他能支持许多内部变换作用到滚动，滑动，渐变消失等。但是实际上，没有办法定义也许会应用到滑动变化上每种类型的效果。...); 我们的“debug”方法不能从外部闭包进入,因此对于我们的实现是私有的。...虽然 javascript 没有明确的类的概念，但是用类来理解它，会更方便。jQuery便是一个封装得非常好的类，比如我们用 语句 $("#btn1") 会生成一个 jQuery类的实例。
、传递的参数 必须是ajax支持的编码格式 4、 URL路径问题 路径不能有中文 27、XMLHttpRequest：XMLHttpRequest.readyState: 状态码的意思 0 － （未初始化...因为本着移动优先的原则，现在写CSS都会用media query（响应式设计），IE8以下的浏览器不支持media query，这会导致@media 声明的CSS不能生效，因此要导入一个css3-mediaqueries.js...IE9支持一部分，因此不能显示一些CSS3的过渡效果，对此有两种办法，一种是忽略，也就是降级或者是差异化设计。...响应式设计 栅格布局 完整的类库 jQuery插件 注意：因为这里要使用大量的html5和css3,所以对浏览器有要求，IE必须9以上。...属性中加一个拓展.scss 第三步：还是在同一个文件，配置一个module属性 第四步：然后在组件的style标签加上lang属性 ，例如：lang=”scss” 有哪几大特性: 1、可以用变量，例如（
React 标准化了事件对象，因此在不同的浏览器中都会有相同的属性。...无状态组件的性能比较高，因为它仅是一个函数，而普通组件是一个class。...fixed 元素要放在 body 上，有更好的浏览器兼容。...)}context 上下文使用场景：公共信息（语言、主题）传递给每个组件，如果组件层级过多，用props传递就会繁琐，用 redux 小题大做。...，是在函数定义的地方，向上级作用域查找，不是在执行的地方左右两张图都将打印 100图片补充知识 - thisthis 在各个场景中取什么值，是在函数执行的时候确定的，不是在定义函数定义的时候决定的作为普通函数使用
（该方法也可以获取 H5 自定义属性） 1.1.3 数据缓存 data() data() 方法可以在指定的元素上存取数据，并不会修改 DOM 元素结构。一旦页面刷新，之前存放的数据都将被移除。...遍历元素 jQuery 隐式迭代是对同一类元素做了同样的操作。 如果想要给同一类元素做不同操作，就需要用到遍历。 语法1 ? ...注意：此方法用于遍历 jQuery 对象中的每一项，回调函数中元素为 DOM 对象，想要使用 jQuery 方法需要转换。 语法2 ? ...注意：此方法用于遍历 jQuery 对象中的每一项，回调函数中元素为 DOM 对象，想要使用 jQuery 方法需要转换。...案例： 品优购电梯导航（上） 1.当我们滚动到 今日推荐 模块，就让电梯导航显示出来 2.点击电梯导航页面可以滚动到相应内容区域 3.核心算法：因为电梯导航模块和内容区模块一一对应的 4.当我们点击电梯导航某个小模块
领取专属 10元无门槛券
手把手带您无忧上云
云服务器
ICP备案
腾讯会议
云直播
对象存储
