JSDOM
关注
分享
扫一扫
hahha
贵哥的编程之路(热爱分享)
我是陈业贵。择一业，终二十年。子幼，看父敬子 子行 看子敬父。以后靠我了[呲牙][呲牙]。父母老了
展开
-
js操作标签最详解(三种方式)
源代码：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>标签的属性</title></head><body> <img src="images/1.j原创 2020-11-02 03:54:59 · 3470 阅读 · 7 评论 -
js 深度解析DOM
1：DOM开篇<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>程序之美</title></head><body> <scrip原创 2020-11-01 09:11:34 · 1305 阅读 · 5 评论 -
offset client page screen详解
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>45-JavaScript-位置获取</title> <style> *{ margin: 0; padding: 0; } div{ widt原创 2020-09-20 01:45:50 · 792 阅读 · 0 评论 -
onmouse各种问题与解决方案
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> *{ margin: 0;原创 2020-09-20 01:29:09 · 1079 阅读 · 0 评论 -
事件冒泡怎么解决，与ie的兼容又怎么解决
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> *{ margin: 0;原创 2020-09-20 01:22:02 · 825 阅读 · 0 评论 -
冒泡的使用
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style type="text/css"> *{原创 2020-09-20 01:16:26 · 780 阅读 · 0 评论 -
事件原理详解
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> *{ mar原创 2020-09-19 00:04:34 · 895 阅读 · 0 评论 -
事件中对象如何兼容各种浏览器
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title></head><body> <button id原创 2020-09-19 00:03:41 · 849 阅读 · 0 评论 -
事件的add几种方式
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title></head><body> <button id="b原创 2020-09-19 00:03:25 · 1085 阅读 · 0 评论 -
dom啦 Date对象
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=a"> <title>Document</title></head><body><script type="text/javasc原创 2020-09-10 22:08:23 · 840 阅读 · 1 评论 -
dom啦 全选反选
<!DOCTYPE html><html><head> <title></title> <style type="text/css"> *{padding:0px;margin: 0px;} .music { width: 400px; box-shadow: 0 0 5px #000; margin: 100px auto; padding-left: 20px; padding-ri原创 2020-09-10 21:48:57 · 675 阅读 · 1 评论 -
dom啦 循环索引同步练习2
<!DOCTYPE html><html><head> <title></title></head><body><button>我是按钮1</button><button>我是按钮2</button><button>我是按钮3</button><script type="text/javascript"> /*原创 2020-09-07 23:47:54 · 671 阅读 · 0 评论 -
dom啦 循环索引同步2
<!DOCTYPE html><html><head> <title></title></head><body><button>我是按钮1</button><button>我是按钮2</button><button>我是按钮3</button><script type="text/javascript"> /*原创 2020-09-07 23:46:24 · 709 阅读 · 0 评论 -
dom啦 循环索引同步练习
<!DOCTYPE html><html><head> <title></title></head><body><button>我是按钮1</button><button>我是按钮2</button><button>我是按钮3</button><script type="text/javascript"> /* for(v原创 2020-09-07 23:30:01 · 682 阅读 · 1 评论 -
dom啦 循环索引同步1
<!DOCTYPE html><html><head> <title></title></head><body><script type="text/javascript"> /* 默认情况下是顺序结构, 代码会从上之下的执行, 前面的没执行完后面的不能执行 默认情况下通过var定义的变量, 只要不是定义在函数中都是全局变量 */ /*for(var i=0;i<原创 2020-09-07 23:17:37 · 648 阅读 · 0 评论 -
dom啦19 闭包
<!DOCTYPE html><html><head> <title></title></head><body> <script type="text/javascript"> /* 1.什么是闭包(closure)? 闭包是一种特殊的函数。 2.如何生成一个闭包? 所以只要满足"是函数嵌套"、"内部函数引用外部函数数据" 3.闭包特点:原创 2020-09-07 19:47:51 · 668 阅读 · 0 评论 -
dom啦18 表单效果
<!DOCTYPE html><html><head> <title></title></head><body><form action="http://www.it666.com"> <input type="text" placeholder="请输入搜索关键字" name="text"> <input type="submit" value="搜索">&l原创 2020-09-07 19:37:18 · 649 阅读 · 0 评论 -
dom啦17 焦点事件
<!DOCTYPE html><html><head> <title></title></head><body><input type="text" name="" id=""><script type="text/javascript">let oInput = document.querySelector("input"); // 1.监听input获取焦点 oInput.on原创 2020-09-06 22:28:18 · 633 阅读 · 0 评论 -
dom啦16 表单校验 核心在于：一样先做完再另一样把。慢慢纠正把。
<!DOCTYPE html><html><head> <title></title> <style type="text/css"> </style></head><body> <form action="http://www.it666.com"> <input type="text" name="" id="" placeholder="请输入账号"原创 2020-09-06 22:22:35 · 593 阅读 · 0 评论 -
dom啦15 商品展示
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>15-JavaScript-商品展示</title> <style> *{ margin: 0; padding: 0; } div{ widt原创 2020-09-06 19:48:12 · 535 阅读 · 0 评论 -
dom啦14 移入移出菜单
<!DOCTYPE html><html><head> <title></title> <style type="text/css"> *{ margin: 0px; padding: 0px; } div { position: fixed; right: 0px; top原创 2020-09-06 19:42:58 · 537 阅读 · 0 评论 -
dom啦13 移入移出事件
<!DOCTYPE html><html><head> <title> </title> <style> *{ margin: 0; padding: 0; } div{ width: 300px; height: 300px; background:原创 2020-09-06 19:28:07 · 594 阅读 · 0 评论 -
dom啦12 简易轮播图
<!DOCTYPE html><html><head> <title></title> <style type="text/css"> *{padding: 0px;margin: 0px;} div { width: 670px; border: 1px solid red; margin: 100px auto; position: relative; } div>img原创 2020-09-06 16:19:41 · 540 阅读 · 0 评论 -
dom啦11 图片展示 核心：在于点击li＞img里面的哪一个就把this.src赋值给div＞img的src
<!DOCTYPE html><html><head> <title></title> <style type="text/css"> *{padding: 0px;margin: 0px;} div { width: 670px; border: 1px solid red; margin: 100px auto; } ul { list-style: none; disp原创 2020-09-05 23:05:38 · 628 阅读 · 1 评论 -
dom啦 10 关闭广告实例 (核心：想要删掉某一个元素就找它自己的父元素，由父元素执行删掉它)
<!DOCTYPE html><html><head> <title></title> <style type="text/css"> *{padding: 0px;margin: 0px;} div { position: fixed; left: 0px; bottom: 0px; } div>img:first-child { position: absolute;原创 2020-09-05 22:55:41 · 570 阅读 · 0 评论 -
dom啦9 定时器大详解
<!DOCTYPE html><html><head> <title></title></head><body><button id="start">开始</button><button id="close">结束</button><script type="text/javascript"> //js定时器分为重复执行与一次执行。 /*let原创 2020-09-05 22:41:07 · 523 阅读 · 0 评论 -
dom啦8 DOM事件
<!DOCTYPE html><html><head> <title></title></head><body><button>我是按钮</button><a href="http://www.it666.com">我是a标签</a><script type="text/javascript"> let qq= document.querySel原创 2020-09-05 20:38:49 · 583 阅读 · 1 评论 -
dom啦7设置 获取 元素的样式
<!DOCTYPE html><html><head> <title></title> <style type="text/css"> .box{ width: 200px; height: 200px; background-color: red; } </style></head><body>原创 2020-09-05 20:34:33 · 595 阅读 · 1 评论 -
dom啦6 增删改查元素的内容
<!DOCTYPE html><html><head> <title></title></head><body><div> 我是div <h1>我是标题</h1> <p>我是段落</p></div><script type="text/javascript"> /*let oDiv = docu原创 2020-09-05 01:44:36 · 527 阅读 · 1 评论 -
dom啦5 获取 修改 新增 删除 元素属性
<!DOCTYPE html><html><head> <title></title> <style type="text/css"> </style></head><body> <img src="1.jpg" alt="cyg" title="陈业贵" nj="666"><script type="text/javascript"> //获取元素的原创 2020-09-05 01:31:49 · 520 阅读 · 0 评论 -
dom啦4 Node增删改查
<!DOCTYPE html><html><head> <title></title> <style type="text/css"> </style></head><body><div> <h1>我是标题</h1> <p>我是段落</p></div><script type="t原创 2020-09-04 23:02:53 · 543 阅读 · 1 评论 -
dom啦3
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>03-JavaScript-获取DOM元素下</title></head><body><div> <h1>1</h1> <h2>2</h2> <p class="i原创 2020-09-04 19:37:17 · 536 阅读 · 1 评论 -
dom啦2
<!DOCTYPE html><html><head> <title></title></head><body> <div class="father"> <form> <input type="text" name="test"> <input type="password" name="test"> </fo原创 2020-09-04 18:19:41 · 469 阅读 · 1 评论 -
dom啦1
<!DOCTYPE html><html><head> <title></title></head><body><script> //什么是window,窗口。 //什么是document?代码窗口中的页面 //document是window的属性,也是一个对象. // document对象保存了网页上所有的内容, 通过document对象就可以操作网页上的内容 console.log(wi原创 2020-09-03 23:53:02 · 485 阅读 · 1 评论