![](https://img-blog.csdnimg.cn/20201014180756925.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
JavaScript
linqunbin
这个作者很懒,什么都没留下…
展开
-
JS图片切换
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-U...原创 2019-05-24 20:44:43 · 1297 阅读 · 0 评论 -
JS基础-DOM增删改
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-U...原创 2019-05-29 21:30:03 · 113 阅读 · 0 评论 -
JS基础-完成轮播图界面(精)
这么小的功能,居然动用这么多代码,太复杂了.<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> &...原创 2019-06-07 18:25:16 · 2836 阅读 · 0 评论 -
JS基础-元素移动动画
将如下代码,保存为JS文件.// 写一条动画的函数:/*参数: obj:要执行动画的对象 attr:要执行动画的样式,比如:left top width height target:执行动画的目标位置 speed:移动的速度(正数向右移动,负数向左移动) callback:回调函数,这个函数将会在动画执行完毕以后执行*/function move(...原创 2019-06-07 18:34:01 · 745 阅读 · 0 评论 -
JS基础-类的操作
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-U...原创 2019-06-07 19:30:22 · 247 阅读 · 0 评论 -
JS基础-JSON
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-U...原创 2019-06-08 11:17:13 · 1131 阅读 · 0 评论 -
Ajax基础知识
向服务器发送请求利用XMLHttpRequest实例与服务器进行通信包含以下3个关键部分-onreadystatechange:事件处理函数-open方法规定请求的类型、URL 以及是否异步处理请求。method:请求的类型;GET 或 POSTurl:文件在服务器上的位置async:true(异步)或 false(同步)-send方法将请求发送到服务器。string:仅用于 ...原创 2019-06-09 11:06:31 · 79 阅读 · 0 评论 -
JS基础-定时器
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-U...原创 2019-06-03 18:30:27 · 731 阅读 · 0 评论 -
JS基础-图片切换练习
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-...原创 2019-06-03 19:57:59 · 118 阅读 · 0 评论 -
CSS JS点击弹出网页窗口(可用于注册账号等场景)
弹窗效果如下:html和JS的代码如下: <button id="open_btn" class="btn">弹窗</button> Bruce测试测试测试 <!-- 弹窗内容开始 --> <div id="background"> <div id="div1"> ...原创 2019-06-15 10:11:21 · 2966 阅读 · 0 评论 -
为class属性添加单击事件
默认情况下,函数无法为所有的class属性,做单击事件.通过如下方法,为所有的class属性,添加单击事件.<span class="test">test1</span> <span class="test">test2</span> <span class="test">test3</span> ...原创 2019-06-15 17:15:15 · 11827 阅读 · 0 评论 -
JS查询兄弟节点的办法
兄弟节点必须要有class属性,这里不能用到id属性.通过子节点,查询父节点,然后通过父节点查询子节点(必须是通过子节点的class属性查询,无法通过id属性查询.)具体代码如下: <div id="box"> <p id="hello">hello world!</p> <p class="test">这...原创 2019-06-15 18:47:32 · 1864 阅读 · 0 评论 -
JS获取窗口高度和宽度代码
JS获取窗口高度和宽度代码window.innerHeight 浏览器窗口的内部高度window.innerWidth 浏览器窗口的内部宽度window.outerheight 返回窗口的外部高度。window.outerwidth 返回窗口的外部宽度。Screen 对象属性screen.availHeight 返回显示屏幕的高度 (除 Windows 任务栏之外)。screen...原创 2019-06-20 13:44:25 · 5873 阅读 · 0 评论 -
JS和CSS网页布局与导航栏设计(精)
中间容器的高度,通过JS代码,实现自适应.最终做出来的效果如下:html代码部分:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initia...原创 2019-06-20 14:54:03 · 2705 阅读 · 1 评论 -
Ajax数据格式之JSON
HTML的代码如下:注:Chrome默认不支持加载本地JSON,Firefox虽然会加载,但是打开游览器额console,会看到报错.<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="w...原创 2019-06-10 23:01:53 · 104 阅读 · 0 评论 -
JS基础-定时器应用1
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-U...原创 2019-06-04 23:22:55 · 112 阅读 · 0 评论 -
JS基础-用户注册阅读
垂直滚动条拉到底后,才允许注册:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <met...原创 2019-06-04 23:26:51 · 110 阅读 · 0 评论 -
JS基础-其它样式相关的属性
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-U...原创 2019-06-07 11:59:48 · 105 阅读 · 0 评论 -
JS基础-BOM Navigator
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-U...原创 2019-06-01 22:57:19 · 356 阅读 · 0 评论 -
JS基础-拖拽
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-U...原创 2019-06-01 19:35:50 · 96 阅读 · 0 评论 -
JS基础-DOM查询01
通过document对象调用(在整个页面查询)- getElementById()通过id属性获取一个元素节点对象- getElementByTagName()通过标签名获取一组元素节点对象- getElementsByName()通过name属性获取一组元素节点对象获取元素节点的子节点(在元素节点内查询)通过具体的元素节点调用- getElementsByTagName()...原创 2019-05-24 21:29:51 · 140 阅读 · 0 评论 -
JS基础-DOM查询02
获取父节点和兄弟节点通过具体的节点调用1 parentNode属性,表示当前节点和父节点2 previousSibling属性,表示当前节点的前一个兄弟节点3 nextSibling属性,表示当前节点的后一个兄弟节点<button id="btn">点我一下</button> <ul id="city"> <li i...原创 2019-05-24 21:33:58 · 76 阅读 · 0 评论 -
JS基础-input全选练习题
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-U...原创 2019-05-25 00:02:13 · 471 阅读 · 0 评论 -
根据CSS选择器来查询一个元素节点对象(querySelectorAll)
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-U...原创 2019-05-26 23:01:40 · 1481 阅读 · 0 评论 -
JS基础-添加删除记录(复杂版)
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-U...原创 2019-05-30 13:29:01 · 255 阅读 · 0 评论 -
JS基础-添加删除记录(简单版)
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-U...原创 2019-05-30 13:29:54 · 281 阅读 · 0 评论 -
JS基础-使用CSS操作内联样式
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-U...原创 2019-05-30 17:05:18 · 2114 阅读 · 0 评论 -
JS基础-定时器应用2(精)
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-U...原创 2019-06-05 21:53:48 · 88 阅读 · 0 评论 -
JS基础-定时器应用3(精)
取消了全局timer变量函数,使用obj.timer作为定时器标示符增加了灰调函数callback()<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width...原创 2019-06-05 22:50:45 · 117 阅读 · 0 评论 -
JS基础-获取元素的样式
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-U...原创 2019-06-01 10:18:58 · 2439 阅读 · 0 评论 -
JS基础-事件对象
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-U...原创 2019-06-01 13:57:11 · 88 阅读 · 0 评论 -
JS基础-div跟随鼠标移动
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-U...原创 2019-06-01 16:16:06 · 120 阅读 · 0 评论 -
JS基础-事件冒泡
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-U...原创 2019-06-01 16:54:40 · 76 阅读 · 0 评论 -
JS基础-事件委派
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-U...原创 2019-06-01 17:36:56 · 3009 阅读 · 0 评论 -
JS基础-事件绑定
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-U...原创 2019-06-01 18:19:09 · 299 阅读 · 0 评论 -
http消息头Content-Type常见的几种值
在Http协议消息头中,使用Content-Type来表示具体请求中的媒体类型信息。例如: Content-Type: text/html;charset:utf-8;常见的媒体格式类型如下:text/html : HTML格式text/plain :纯文本格式text/xml : XML格式image/gif :gif图片格式image/jpeg :jpg图片格式image/p...转载 2019-06-18 00:48:04 · 863 阅读 · 0 评论