关注
分享
1. 网页行为进行编程
2. 世界上最流行的脚本语言。
3. JavaScript 是属于 web 的语言，它适用于 PC、笔记本电脑、平板电脑和移动电话。
4. 被设计为向 HTML 页面增加交互性。
pinkowonote
汤家凤：你这个年纪你怎么能睡得着觉？
展开
-
设置了 *{padding: 0；margin: 0；} 但是没有用，仍然有padding【已解决】【蠢蛋】
@media screen and (min-width: 768px) { *{ padding: 0; margin: 0; } .container { width: 750px; /* background-color: aqua; */ margin: 0 auto; } .container ul li { float: left; /* display: inli原创 2020-08-03 11:55:54 · 2245 阅读 · 0 评论 -
display:inline-block元素之间产生空隙
https://blog.csdn.net/qq_32614411/article/details/82223624@media screen and (min-width: 768px) { *, *::before, *::after { margin: 0px; padding: 0px; } .container { width: 750px; background-color: aqua;原创 2020-08-03 11:22:38 · 135 阅读 · 0 评论 -
将 需要获取className的方法 封装成函数
<!-- 将ul里的li中含有class = "box"的li的背景颜色设置为红色1. 获取含有class = "box"的li2. 设置背景颜色为红色 --><!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0原创 2020-08-02 22:28:35 · 120 阅读 · 0 评论 -
设置元素的属性：使用./[]/setAttribute方法
<!-- 设置元素的属性：使用./[]/setAttribute方法 点击按钮，将text里的值变换为其他值1. 获取按钮和文本框2. 按钮添加onclick事件，当点击时，文本框的value值变为其他--><!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device原创 2020-08-02 21:52:27 · 344 阅读 · 0 评论 -
首尾节点和兄弟节点
<!-- 首尾节点和兄弟节点：将ul中的第一个li的背景颜色设置为红色1. 获取ul和li2. 将ul的firstChild.style.backgroundColor = "red"3. 兼容性问题也要考虑到 --><!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=原创 2020-08-02 21:19:04 · 437 阅读 · 0 评论 -
使用offsetParent
<!-- 使用offsetParent距离该子元素最近的进行过定位的父元素（position：absolute relative fixed），如果其父元素中不存在定位则offsetParent为：body元素 --><!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=de原创 2020-08-02 20:04:34 · 124 阅读 · 0 评论 -
点击li里的隐藏超链接，将ul里的li隐藏
<!-- 点击li里的隐藏超链接，将ul里的li隐藏1. 使用for获取ul的子节点，当点击隐藏按钮时，li消失 --><!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title&原创 2020-08-02 19:46:25 · 465 阅读 · 0 评论 -
将ul里的li背景颜色变红（使用dom的方法）
<!-- 将ul里的li背景颜色变红（使用dom的方法） 获取ul的子节点，将li背景颜色设置为红色--><!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Docu原创 2020-08-02 19:31:51 · 1621 阅读 · 0 评论 -
手风琴
<!-- 手风琴：1. 一个横向ul有序列表，鼠标移到其中的li时，li的宽度增加2. 在ul里，鼠标移出li时，li宽度变为正常3. 当鼠标在ul外时，所有li宽度正常 --><!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial原创 2020-07-31 19:28:14 · 85 阅读 · 0 评论 -
闭包案例
https://blog.csdn.net/qq_42833001/article/details/87252890https://www.cnblogs.com/csuwujing/p/8021913.html异步，同步任务立即执行函数（方法（i））（调用前面的方法，所以可以写参数i）var obutton = document.getElementsByTagName("button");for (var i = 0; i < obutton.length; i++) { obu原创 2020-07-31 17:30:35 · 72 阅读 · 0 评论 -
作用域链和预解析的案例
//问1——>123 function f1() { var num = 123; function f2() { console.log(num); } f2(); } var num = 456; f1(); //相当于 function f1() { var num; function f2() { console.log(num); } num = 123; .原创 2020-07-31 16:17:11 · 109 阅读 · 0 评论 -
JavaScript作用域链的配置机制
作用域链是 JavaScript 提供的一套解决标识符的访问机制：JavaScript 规定每一个作用域都有一个与之相关联的作用域链。作用域链用来在函数执行时求出标识符的值。在对标识符进行求值的过程中：该链中包含多个对象，就会从【链首的对象】开始，然后依次查找后面的对象，直到在某个对象中找到与标识符名称相同的属性。如果在作用域链的顶端（全局对象）中仍然没有找到同名的属性，则返回 undefined 的属性值。（在每个对象中进行属性查找的时候，还会使用该对象的原型域链。在一个执行上下文，与其关联的作用.原创 2020-07-31 15:54:21 · 155 阅读 · 0 评论 -
移出outer，所有div颜色最亮
<!-- 鼠标放在其中一个div上时，颜色最亮在outer里，但移出这个div时，和颜色最低移出outer，所有div颜色最亮--><!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <原创 2020-07-31 09:44:06 · 153 阅读 · 0 评论 -
实现全选,反选,不选
<!-- 实现全选,反选,不选1. 获取若干个checkbox和3个button按钮2. 在3个button按钮中添加onclick事件3. checkbox选择:checked = "true"(checked = "checked"可不可以?)4. 全选:选择所有checkbox,将其值设置为checked = "true"5. 不选:选择所有checkbox,将其值设置为checked = "false"6. 反选:手动check某些checkbox,使用if判断语句:if(che原创 2020-07-30 15:06:51 · 212 阅读 · 0 评论 -
点击按钮将8个div盒子都设置为红色
<!-- 点击按钮将8个div盒子都设置为红色:1. 获取button和div对象2. button上绑定点击onclick事件3. 使用for循环来得到所有的div,将他们背景设置为红色:for(var i = 0;i < odiv.length; i++){ odiv[i].style.backgroundColor = "red"; }4. 顺序我要试试看 --><!DOCTYPE html><html lang="en">原创 2020-07-30 10:57:20 · 468 阅读 · 0 评论 -
选项卡:选择一个按钮改变div的背景颜色
<!-- 选项卡:选择一个按钮改变div的背景颜色1. 获取三个button按钮和一个div2. 最先给div设置基本背景颜色3. 3个button设置onclick事件4. 点击按钮之后,div.style.cssText={background-color:选定颜色}--><!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta原创 2020-07-30 09:46:54 · 1352 阅读 · 0 评论 -
点击更多按钮,出现div,再次点击,div消失
<!-- 点击更多按钮,出现div,再次点击,div消失1. 获取button按钮和div2. div首先时display:none3. 给button添加onclick事件4. 判断:if(div是display:none){ 点击button之后: div是display:block} else{ 点击button之后: div是display:none}--><!DOCTYPE html><html lang="en"原创 2020-07-30 01:56:53 · 961 阅读 · 0 评论 -
点击按钮，输入框内的文字就会发生变化
<!-- 点击按钮，输入框内的文字就会发生变化1. 获取button按钮和input输入框2. 为button添加onclick事件3. 将文字赋值给input.value中 --><!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, init原创 2020-07-30 01:01:16 · 942 阅读 · 0 评论 -
改变外部样式link标签，来改变整个页面的效果
<!-- 改变外部样式link标签，href中css的链接，来改变整个页面的效果1. 获取页面的按钮和link标签2. 给两个按钮分别装上onclick事件3. 在onclick事件中改变href属性的值--><!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=devi原创 2020-07-30 00:52:13 · 662 阅读 · 0 评论 -
鼠标移入移出的div显示和消失
<!-- 鼠标移入和移出input上：鼠标移入div显示，鼠标移出div隐藏 1. 获取input和div（已设置好div样式）2. div首先是display:none3. 当onmouseover的时候，div是display:block4. 当onmousemove的时候，div是display:none--><!DOCTYPE html><html lang="en"><head> <meta charset="UTF-原创 2020-07-30 00:35:40 · 4580 阅读 · 0 评论 -
onmouseout和onmousemove
onmouseout和onmousemoveonmouseout 事件会在鼠标指针移出指定的对象时发生。onmousemove 事件会在鼠标指针移动时发生。原创 2020-07-30 00:23:12 · 156 阅读 · 0 评论 -
JS改变CSS样式
1. JS控制CSS的行内样式（内联样式）案例：一个红色盒子，被按钮点击之后，变成蓝色盒子<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title&原创 2020-07-29 10:07:47 · 305 阅读 · 0 评论