随笔分类 - python笔记
摘要：编辑本博客 获取所需元素对象 监听对象 定位属性 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>导航条案例</title> <script src="js/jquery-3.3.1.js"></script
阅读全文
摘要：编辑此博客 position 获取元素相对父元素的位置 <script type="text/javascript"> $(function(){ //获取元素相对父元素的位置 console.log($("p").position().left) console.log($("p").positi
阅读全文
摘要：编辑本博客 插入操作 append() 字符串，"<li><a href='#'>LuFull</a></li>" //直接以字符串方式追加内容 $('ul').append("<li><a href='#'>LuFull</a></li>") View Code //直接以字符串方式追加内容 $(
阅读全文
摘要：编辑本博客 HTML属性操作：对HTML文档的属性进行读取，设置和移除操作。如attr(),removeAttr() DOM属性操作：对DOM元素的属性进行读取，设置和移除操作。如prop(),removeProp() 类样式操作：对DOM属性className进行添加，移除操作。如addClass
阅读全文
摘要：编辑本博客 显示效果 show(speed,callback) speed：三种预定义字符串之一（slow，normal，fast）或时间“毫秒” callback：动画执行完后运行的函数，每个元素执行一次 hide(speed,callback) 与show()方法类似 toggle(speed,
阅读全文
摘要：编辑本博客 相互转换 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>jQuery对象和DOM操作</title> <script src="js/jquery-3.3.1.js"></script> </h
阅读全文
摘要：编辑本博客 基础选择器 id选择器 标签选择器 类选择器 通配符选择器 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>基础选择器</title> <script src="js/jquery-3.3.1.j
阅读全文
摘要：编辑本博客 JQuery是JavaScript的一个库，必须先引入，再使用。 是库文件一般都会抛出来构造函数或者对象，构造函数用new关键字创建，对象则直接调用属性和方法 DOM文档加载顺序： 解析HTML文档结构 加载脚本和样式文件 解析和执行脚本代码 DOM树构建完成，开始执行jQuery的re
阅读全文
摘要：编辑本博客 监听滚动条 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>scroll系列</title> <style type="text/css"> *{ padding: 0; margin: 0; }
阅读全文
摘要：编辑本博客 元素占位高，和宽 offsetTop：没有设置定位的话，到浏览器顶部的距离。如果设置定位后，即以父盒子为基准，即top值 offsetLeft：没设置定位，即到浏览器左边的位置。如果设置定位，则以父盒子为基准，即left值 offsetWidth：内容宽度+padding+border
阅读全文
摘要：编辑本博客 window.onresize：监控屏幕可视区域的变化 document.documentElement.clientWidth：屏幕可视宽度 document.documentElement.clientHeight：屏幕可视高度 <!DOCTYPE html> <html lang=
阅读全文
摘要：编辑本博客 BOM常用对象和方法： window.navigator.userAgent，用户浏览器 location，用window.location.href="https://www.baidu.com";进行页面调整 window.location.reload()全局刷新，尽量少用，刷新用
阅读全文
摘要：编辑本博客 clientTop:顶部边框宽度 clientLeft:左边边框宽度 clientWidth:内容区域+左右padding区域，即可视宽度 clientHeight:内容区域+上下padding区域，即可视高度 <!DOCTYPE html> <html lang="en"> <head
阅读全文
摘要：编辑本博客 ECMAScript，js语法 BOM浏览器对象模型，输出，屏幕宽高，滚动的宽高，setInterval等，window.open(),window.close(),window.location()等
阅读全文
摘要：编辑本博客 open():打开网页，类似a标签，行间调用open方法window不能省略，参数2，_self表示当前窗口 close()：关闭当前网页 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>BOM之
阅读全文
摘要：编辑本博客 巧用定时器 获取标签方式 清理定时器 记住当前位置 巧用定时器 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>无缝轮播</title> <style> *{ padding: 0; margin
阅读全文
摘要：编辑本博客 setTimeout(func,inener)定时函数，隔x秒后执行一次动作 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>5秒后关闭广告</title> <style type="text/c
阅读全文
摘要：编辑本博客 this.onmouseover()鼠标悬浮在对象上 this.onmouseout()鼠标从对象上移除，还有其他很多方法 善用定时器清理 留意index值，可能在对象上存在其他对象，导致鼠标移动上去方法不生效 <!DOCTYPE html> <html lang="en"> <head
阅读全文
摘要：编辑本博客 通过setInterval做动画 动画运动到一定位置需要用clearInterval(inter)将定时器进行清理 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>匀速运动案例</title> <
阅读全文
摘要：编辑本博客 使用定时器setInterval(func,interval)循环监控事件 使用Date()对象，通过get获取年月日，时分秒，注：月是以0开始的，所有需要在获取到的值上进行加1操作 通过document.body.innerHTML来讲值写入body中 另写一个num()函数来判断数字
阅读全文
浙公网安备 33010602011771号