首页
学习
活动
专区
圈层
工具
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    前端成神之路-03_jQuery

    插件就是引入别人写好的:html 、css、js (有时也可以只引入一部分,读懂后也可以修改部分内容) 1.4.2....注意点2: 获取本地存储数据,需要把里面的字符串转换为对象格式JSON.parse() 我们才能使用里面的数据。...(i, 1)方法 // 5.存储修改后的数据,然后存储给本地存储 // 6.重新渲染加载数据列表 // 7.因为a是动态创建的,我们使用on方法绑定事件 1.7.6 案例:toDoList 正在进行和已完成选项操作...// 1.当我们点击了小的复选框,修改本地存储数据,再重新渲染数据列表。...// 4.之后保存数据到本地存储 // 5.重新渲染加载数据列表 // 6.load 加载函数里面,新增一个条件,如果当前数据的done为true 就是已经完成的,就把列表渲染加载到 ul 里面 //

    3K20

    JAVA—— AJAX

    一般的网页如果需要更新内容,必需重新加载个页面。 而 AJAX 通过浏览器与服务器进行少量数据交换,就可以使网页实现异步更新。...也就是在不重新加载整个页 面的情况下,对网页的部分内容进行局部更新。 ​...可以在不重新加载整个网页的情况下,对网页的某部分进行更新。 打开链接:open(method,url,async) ​ method:请求的类型 GET 或 POST。 ​...也就是在不重新加载整个页面的情况下,对网页的部 分内容进行局部更新。 同步和异步 同步:服务器端在处理过程中,无法进行其他操作。 异步:服务器端在处理过程中,可以进行其他操作。...将请求标记置为 false,当前异步操作完成前,不能重新发起请求。 根据当前页和每页显示的条数来请求查询分页数据。 当前页码+1。 服务器 获取请求参数(当前页,每页显示的条数)。

    3K30

    给网站添加PJAX无刷新

    AJAX(Asynchronous JavaScript and XML)是一种异步技术,旨在实现跨页操作而不需页面刷新。...它通过在页面刷新时添加历史记录功能(通常表现为左侧和右侧的 ← 和 → 按钮),允许用户通过按钮快速返回到之前的状态而不需重新加载页面。这种特性特别适合需要快速切换状态的应用场景,显著提升了交互体验。...开源社区提供了多种解决方案,其中JQuery版本的PJAX因其流行性和丰富性备受关注。...然而,对于不习惯或不想依赖JQuery的开发者来说,使用无库版本的PJAX组件(如Kico Style)是一个更简洁、高效的替代方案。...我们手动判断 DOM 结构,合理的编写 PJAX 替换页面内容所需要的选择器,就可以把在网页刷新过程中发生变化的那一部分给 “刷新”。只要是个网站,每次切换页面的时候,title 标签是必然得替换的。

    7400

    3分钟搞定图片懒加载

    为什么需要懒加载 对于一个页面加载速度影响最大的因素之一就是图片资源,如果一个页面图片太多(比如某宝,某东等),整个页面的图片大小可以到达几百兆,即使在百兆宽带,全部下载的话,也需要上十秒的时间,这对于用户耐心的考验是巨大的...而且,用户可能只翻看一两页就退出了,剩下未查看的图片也就不需要加载了。这也相当于节省了带宽资源。 懒加载实现原理 由于浏览器会自动对页面中的img标签的src属性发送请求并下载图片。...因此,通过html5自定义属性data-xxx先暂存src的值,然后在需要显示的时候,再将data-xxx的值重新赋值到img的src属性即可。.../images/10.jpg"> jquery.com/jquery-1.11.3.min.js">jquery-1.11.3.min.js"> $(function () { let pageNum = 2; // 因为第一页没有图片,

    2.5K20

    Pbcms Ajax 无刷新加载内容

    //先定义一些基本的内容 //Page就是第几页,由当前页0 + 1,就是第二页,parseInt确保该数值是Int类型。...var Page = parseInt('0') + 1; //Num就是每页几条信息,因为列表默认显示的是2条,所以这里设为2,结合上面的第二页实际上就是从第三条信息开始读取。...,页面就会无刷新加载 2 篇文章了。...;          //页面的高度     var DocHeight = jQuery(document).height();          //定义一个开关     var load = true...;          //判断:(窗口与页面顶部距离 + 窗口高度) >= 页面的高度(也就是滚动到页面底部的时候),并且开关是开启状态,执行ajax加载内容     if( ( WindowTop +

    4.2K20

    Browser 对象(一、history)

    history对象包含用户在浏览器窗口中访问过的URL history对象是window对象的一部分,也就是说可以window.history进行访问 1、history对象的属性(length) console.log.../加载前第一个URL history.go(-2);//加载前第二个URL history.go(1);//加载下第一个URL history.go(2);//加载下第二个URL 通过调用history.go...)); }); }); 实例:我们在pc端常见的分页方法,因头部等大部分都是相同的,所以我们分页的时候基本采用ajax请求来完成产品的替换,作用是为了减少页面的加载...但是他会出现一个很严重的问题(由于页面没有重新加载,浏览器URL历史中在每次下一页后是不会新添加的URL,因为只是局部刷新,所以不会添加新的URL,这就导致了,浏览器的返回上一页功能不能使用),pushState....eq(num).addClass('on'); } } }; 语法:history.replaceState(state, title, url); jquery.pajx.js

    92610

    jQuery 插件

    我们将重点详细讲解,从找到插件所在网页,然后点击下载代码,到插件的使用等,后面的插件使用可参考瀑布流插件的使用。 下载位置 代码演示 ​ 插件的使用三点:   1....插件就是引入别人写好的:html 、css、js  (有时也可以只引入一部分,读懂后也可以修改部分内容) 1.2....图片懒加载插件 ​ 图片的懒加载就是:当页面滑动到有图片的位置,图片才进行加载,用以提升页面打开的速度及用户体验。...(下载略) 代码演示 ​ 懒加载只需引入html 和 js操作 即可,此插件不涉及css。...$('#btn').modal() }) 1.6. bootstrap案例-阿里百秀 1.通过调用组件实现导航栏2.通过调用插件实现登录3.通过调用插件标签页实现

    7.1K10

    js的动态加载、缓存、更新以及复用(一)使用范围:遇到的问题:目标:页面结构:正文

    使用jQuery提供的方法吗?这个倒是可以,但是页面必须引用jQuery和我写的加载js文件的js。也就是说一个页面要写两个,这个就麻烦了。...一般的做法是,父页里加载jQuery.js,然后子页里也要加载jQuery.js。当然当子页在加载jQuery.js的时候,直接从缓存里面提取,一般不会再去折腾服务器了。   ...父页里使用jQuery   Var aa = $(’div’);  //找到父页里的所有div   子页里是不是可以这么做?   ....$ (’div’) ; //能够找到div,但是不是子页的div而是父页里的div。   咋回事呢?原因就在于搜索范围。jQuery是有三个参数的,我们平时只用了第一个,后面的就被忽略了。...没有指定的时候,jQuery会在哪里搜索呢?加载jQuery的页面里面搜索,而不是调用$的页面里搜索。

    4.1K50

    「jQuery」基础 - 03

    总结:jQuery插件就是引入别人写好的:html 、css、js (有时也可以只引入一部分,读懂后也可以修改部分内容) 1.4.2....注意点2: 获取本地存储数据,需要把里面的字符串转换为对象格式JSON.parse() 我们才能使用里面的数据。...每次渲染之前,先把原先里面 ol 的内容清空,然后渲染加载最新的数据。 1.7.5 案例:toDoList 删除操作 点击里面的a链接,不是删除的li,而是删除本地存储对应的数据。...,然后存储给本地存储 重新渲染加载数据列表 因为a是动态创建的,我们使用on方法绑定事件 1.7.6 案例:toDoList 正在进行和已完成选项操作 当我们点击了小的复选框,修改本地存储数据,再重新渲染数据列表...之后保存数据到本地存储 重新渲染加载数据列表 load 加载函数里面,新增一个条件,如果当前数据的done为true 就是已经完成的,就把列表渲染加载到 ul 里面 如果当前数据的done 为false

    2.8K30

    使用脚本操作UpdatePanel中控件的问题

    这个页面在初次加载的时候自然随着整个页面的刷新加载而加载,因此作用于页面级别的jQuery代码可以起到作用。...但是等到点击button之后,仅仅是UpdatePanel中的内部内容刷新了,整个页面根本不刷新(换句话说,整个页面的jQuery根本没有执行)。因此没有任何作用了。   ...解决方案就是设法获取异步页面的加载脚本事件,然后进行赋值:     Test     <script src="Scripts/...同样地,这两个事件:  【相同点】一旦页面刷新,或者点击Submit页面导致整个页面回发,或者位于UpdatePanel中的按钮导致局部页回发,Page_Load和add_load照样执行。  ...单击Button的时候,就UpdatePanel回发,因此page方面的事件逐一被激发,最后重新加载UpdatePanel,然后Application的load事件才被激发(全部页面加载完毕)。

    1.6K100

    js 分页插件_vue分页组件

    二、具体使用方法: (1)第一步,导入jquery和pagination.js jquery.js"> Jetbrains全家桶1年46,售后保障稳定...是我全部加载数据后平均分配到每一页10条数据,然后依次显示下去吗??...当然不是,我每当点击页数按钮的时候都要去加载数据,重新发起AJAX请求到服务器,然后返回数据给我们,那我们就大概知道怎么使用这个分页功能了!! (1).首页,你得知道你分页按钮上需要显示几页吗??...(data){ //data.length 就是数据的长度 ,也就是上面的10,具体参数名看你们服务器的返回叫什么 //data.count 是数据的总长度,也就是50,具体参数名看你们服务器的返回叫什么...上面第四点中分析到,点击按钮需要重新发起AJAX请求,需要把显示条数和当前的页数传回给服务器 $.ajax({ url:… type:”post”, data:{ rows: 10 //我把行数传回给服务器中

    15.3K20

    jQuery平滑翻页

    使用jQuery可以很方便地实现平滑翻页效果。实现平滑翻页效果的步骤要实现平滑翻页效果,我们可以使用jQuery的动画功能和一些事件处理方法。...编写动画效果:在事件处理程序中,我们可以使用jQuery的动画方法,如animate()或slideUp(),来实现页面的平滑翻页效果。通常是通过更改页面的位置或透明度来实现平滑过渡。...更新页面内容:在完成页面的平滑翻页过渡后,我们可以通过改变页面内容,例如更新标题、加载新的数据等,来更新页面。...showPage()函数用于显示指定页的内容,通过添加和移除active类来实现页面的显示和隐藏。nextPage()和prevPage()函数分别用于处理下一页和上一页的操作。...当点击"Next"按钮时,页面会平滑地滑出并显示下一页的内容;当点击"Previous"按钮时,页面会平滑地滑出并显示上一页的内容。

    1.4K10
    领券