随笔分类 -  javascript

1 2 3 4 下一页
HTML DOM-->轮播图
摘要：实现：图片的轮播 html代码： <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>轮播图</title> <!-- 导入css样式--> <link rel="stylesheet" type='text/css' href=" 阅读全文
posted @ 2020-05-06 22:51 abner_pan 阅读(437) 评论(0) 推荐(0)
HTML DOM-->拖拽效果
摘要：实现：按下鼠标拖动，盒子跟着一起移动 代码如下： <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>js_excise</title> <style type="text/css"> body{ position: relativ 阅读全文
posted @ 2020-05-05 22:35 abner_pan 阅读(348) 评论(0) 推荐(0)
JS 浏览器BOM-->Window confirm() 方法
摘要：1.定义和用法 confirm()方法用于显示一个带有指定消息和确认及取消按钮的对话框。 如果访问者点击"确定"，此方法返回true，否则返回false。 语法： confirm(message) 举例： <!DOCTYPE html> <html> <head> <meta charset="ut 阅读全文
posted @ 2020-05-05 21:24 abner_pan 阅读(420) 评论(0) 推荐(0)
HTML DOM-->事件对象(阻止冒泡、阻止默认行为)
摘要：1.阻止冒泡： stopPropagation() 举例： <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>js_excise</title> </head> <body> <div id="box1" style="backg 阅读全文
posted @ 2020-05-04 22:41 abner_pan 阅读(974) 评论(0) 推荐(0)
HTML DOM-->事件流
摘要：2.事件流的实现 通过true或false来控制 举例1：从外向内流：true <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>js_excise</title> </head> <body> <div id="box1" st 阅读全文
posted @ 2020-05-02 12:15 abner_pan 阅读(196) 评论(0) 推荐(0)
HTML DOM-->鼠标事件的event对象
摘要：1.定义和使用 浏览器可视窗口坐标： clientY clientX 页面坐标： pageX pageY 电脑屏幕坐标： screenX screenY 鼠标按键： button 阅读全文
posted @ 2020-05-02 11:00 abner_pan 阅读(219) 评论(0) 推荐(0)
HTML DOM-->键盘事件：keydown/keyup/keypress
摘要：1.定义和使用 keydown:某个键盘按键被按下 keyup:某个键盘按键被松开 keypress:个键盘按键被按下并松开 注意： 1. 键盘事件的属性不能用于以下元素: <base>, <bdo>, <br>, <head>, <html>, <iframe>, <meta>, <param>, 阅读全文
posted @ 2020-04-29 22:53 abner_pan 阅读(1872) 评论(0) 推荐(0)
HTML DOM-->鼠标事件：mouseover\mouserout\mousedown\mouseup\mousemove
摘要：1.定义和使用 mouseover:鼠标移到某元素之上 mouseout:鼠标从某元素移开 mousedown:鼠标按钮被按下 mouseup:鼠标按键被松开 mousemove:鼠标被移动 举例： <!DOCTYPE html> <html> <head> <meta charset="utf-8 阅读全文
posted @ 2020-04-29 22:04 abner_pan 阅读(1356) 评论(0) 推荐(0)
HTML DOM-->鼠标事件单击(click)与双击(dblclick)
摘要：1.定义和使用 click：单击事件 dblclick：双击事件 注意：区分单击还是双击，使用延时定时器 代码如下： <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>js_excise</title> </head> <styl 阅读全文
posted @ 2020-04-22 22:55 abner_pan 阅读(5444) 评论(0) 推荐(0)
HTML DOM-->焦点事件[focus()/blur()]
摘要：1.定义和使用 1）、focus() 方法用于为元素设置焦点 语法：HTMLElementObject.focus() 2）、 blur() 方法来移除元素焦点 语法：HTMLElementObject.blur() 注意：焦点事件一般用于文本框上 举例： <!DOCTYPE html> <html 阅读全文
posted @ 2020-04-22 22:44 abner_pan 阅读(2016) 评论(0) 推荐(0)
HTML DOM-->事件处理程序
摘要：1.概念 事件：就是用户或者是浏览器执行的某种动作。 事件处理程序：就是响应事件的函数，事件处理程序的名字是以“on”开头的 2.事件的创建 方法1：直接在html标签中给与事件处理程序同名的属性赋值js代码 举例1：点击按钮，弹出提示框提示 <!DOCTYPE html> <html> <head 阅读全文
posted @ 2020-04-22 22:30 abner_pan 阅读(244) 评论(0) 推荐(0)
HTML DOM-->DOM节点动态操作
摘要：1. 2. 3. 4. 5. 6. 7. 8. 9. 阅读全文
posted @ 2020-04-21 22:24 abner_pan 阅读(193) 评论(0) 推荐(0)
HTML DOM-->节点常用的属性
摘要：1.节点共有的属性 nodeName、nodeType、nodeValue 举例： <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>js_excise</title> <script src="./js/js_excise.js 阅读全文
posted @ 2020-04-21 22:01 abner_pan 阅读(306) 评论(0) 推荐(0)
HTML DOM-->内部样式表与外部样式表的读写
摘要：1.获取 IE中： 元素节点.currentStyle.样式属性表 元素节点.currentStyle['样式属性名'] 其他： window.getComputedStyle(元素节点，伪类).样式属性名 window.getComputedStyle(元素节点，伪类)['样式属性名'] 伪类一般 阅读全文
posted @ 2020-04-18 12:10 abner_pan 阅读(335) 评论(0) 推荐(0)
HTML DOM-->行间样式表的读写
摘要：1.行间样式表的读写 1：获取元素节点 var js = document.getElementById('in') 2：获取style的属性节点 var jsStyle = js.style 3：获取样式表中的样式属性的属性值 style属性节点.样式属性名 元素节点.style.样式属性名 元素 阅读全文
posted @ 2020-04-18 10:47 abner_pan 阅读(202) 评论(0) 推荐(0)
HTML DOM-->获取文本节点
摘要：1.元素节点.innerHTML 从对象的开始标签到结束标签的全部内容，不包括本身html标签 举例：获取button标签之间的内容 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>js_excise</title> <scri 阅读全文
posted @ 2020-04-17 22:18 abner_pan 阅读(1236) 评论(0) 推荐(1)
HTML DOM-->获取属性节点
摘要：1.方法一： 获取官方定义的属性直接使用： 元素节点.属性名 得到元素对应属性的属性值 举例：获取placeholder的属性值 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>js_excise</title> <script 阅读全文
posted @ 2020-04-17 21:59 abner_pan 阅读(1861) 评论(0) 推荐(0)
HTML DOM-->获取标签(元素)节点
摘要：1.根据元素id获取元素节点： document.getElementById(str) 举例： <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>js_excise</title> <script src="./js/js_ex 阅读全文
posted @ 2020-04-17 21:20 abner_pan 阅读(2099) 评论(0) 推荐(0)
HTML DOM-->简介
摘要：1.了解DOM DOM:文档对象模型(Document Object Model) DOM是访问HTML和操作HTML的标准 Core DOM:核心DOM，针对任何结构化文档的标准模型 XML DOM：针对XML 文档的标准模型 HTML DOM:针对HTML 文档的标准模型 2.DOM节点的分类 阅读全文
posted @ 2020-04-16 22:59 abner_pan 阅读(130) 评论(0) 推荐(0)
JS 浏览器BOM-->setTimeout() 方法
摘要：1.定义和用法 setTimeout() 方法用于在指定的毫秒数后调用函数或计算表达式。 提示：只执行一次,如果你只想重复执行可以使用 setInterval() 方法。 语法： [window.]setTimeout(code/function, milliseconds, param1, par 阅读全文
posted @ 2020-04-16 22:37 abner_pan 阅读(269) 评论(0) 推荐(0)

1 2 3 4 下一页