- 博客(36)
- 收藏
- 关注
RSS订阅
1原创 js中for循环
循环结构：用于处理重复的执行语句，达到重用的目的 var sum=0 for(var i =0;i<=50;i++){ if(i%2==0){ sum+=i } }循环控制break：结束整个循环，在循环嵌套中，就近原则（距离那个循环近就断掉那个循环）continue：当次循环以后的代码不执行，执行下一次的循环循环实例：1~100以内的质数 var last_num = 2; //上一个数 for (let i = 2; i <...
2022-05-27 08:45:31
499
原创 DOM编程
一、获取节点//通过id查询节点var h1 = document.getElementById("h1")//通过标签查询节点（查询的是一类节点，返回的是一个类似数组的HTML集合）var p = document.getElementsByTagName("p") //通过类名来获取节点元素（返回的是一个类似数组的HTML集合）var lo = document.getElementsByClassName("lo") //通过name来获取节点元素（返回的是一个类似数组的节点
2022-05-25 21:26:14
432
原创 js与css交互
1、使用style属性制作菜单特效<style type="text/css"> ul { list-style: none; }ul>li { width: 50px; height: 20px; float: left; background-color: #414141; }</style></head><body> <ul> <li style="#fff">首页<
2022-05-22 20:39:32
105
原创 事件的监听的三种方式
<h1 onclick="calllMe()">事件的监听</h1><button type="button" id="btn">点我</button><button type="button" id="btn2">点点我</button><script type="text/javascript"> //事件响应写在HTML标签属性里面 function calllMe(){ alert("我被电到了").
2022-05-22 15:41:18
309
原创 DOM文档对象模型（二）
一、节点关系查找<div id="parent"> <p>我是第一个</p> <p id="p2">我是第二个</p> <p>我是第三个</p> <h5>我是最后一个</h5></div>// parent的第一个子节点var frist = parent.firstElementChild;//parent的第一个最后一个子节点var last =...
2022-05-22 15:38:28
65
原创 DOM文档对象模型（一）
一、获取节点//通过id查询节点var h1 = document.getElementById("h1")//通过标签查询节点（查询的是一类节点，返回的是一个类似数组的HTML集合）var p = document.getElementsByTagName("p")//通过类名来获取节点元素（返回的是一个类似数组的HTML集合）var lo = document.getElementsByClassName("lo")//通过name来获取节点元素（返回的是一个类..
2022-05-18 19:17:13
599
原创 BOM对象模型
一、javascript由哪三个部分组成ECMAScript（描述了语言的基本语法和数据类型） DOM（文档对象模型） BOM（浏览器对象模型）二、window的三个常用的事件//onload窗口加载事件window.onload = function() { var p1 = document.getElementById("p1") alert(p1.innerText) }// onscroll页面滚动监听window.onscroll = functi
2022-05-17 19:25:57
100
原创 animation动画-精灵图应用
HTML：<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>小鸟飞</title> <link rel="stylesheet" type="text/css" href="../css/小鸟.css"/> </head> <body> <div class="box"></div>
2022-04-15 20:40:19
115
原创 html多级导航
效果图：HTML：<div class="nav"> <ul> <li>数据1</li> <li>数据2 <ul> <li>数据1</li> <li>数据2</li> <li>数据3 <ul> <li>数据1</li> ..
2022-04-06 21:43:25
350
原创 CSS浮动-float属性
浮动的作用：可以快速实现两端对齐1、浮动会使元素自动切换为行内块元素。2、浮动后，父元素会出现高度丢失问题解决方法：（1）给父节点添加height（2）父节点添加属性，overflow：hidden（3）在父元素最后一个元素后加一个div，设置属性clear：both（4）伪元素清楚，方便重用.clearfix::after{ clear: both; /* 清楚两边浮动*/ content: ''; /*内容为0*/ display: blo
2022-04-01 21:08:34
107
原创 css背景图-精灵图应用
精灵图：html代码：<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <link rel="stylesheet" type="text/css" href="../css/财神.css"/> </head> <body> <div class="box">.
2022-03-30 21:07:05
222
原创 css盒子模型
css盒子模型：盒子模型分类：content-box（内容大小）border-box（边框+内填充+内容总大小）盒子模型中的属性：/* 内容区域 width/height */content/* 内填充 */padding: ; /* padding-top/right/bottom/left*//* 外边距 */margin: ; /* margin-top/right/bottom/left *//* 边框 */
2022-03-30 20:55:27
32
原创 css小练
1.html结构<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <link rel="stylesheet" type="text/css" href="../css/热点专题.css"/> </head> <body> <div class="box"> <d
2022-03-29 20:37:50
38
原创 css入门基础
1.css的引入方式<!--内嵌式样式 --><style type="text/css"> h1{ background-color: red; }</style><!-- 外链式样式 --><link rel="stylesheet" type="text/css" href="../css/css样式.css" /><!-- (标签内)行内式样式 --><h1 style="ba
2022-03-28 21:07:37
235
原创 HTML基础总结
1.块元素 display：block<p>、<h>、<ul>、<ol>、<div>、<hr>、<form>2.行元素display:inline<b>、<strong>、<i>、<em>、<sup>、<sub>、<small>、<span>、<a href></a>、<label&g
2022-03-25 20:43:20
37
原创 Html表单设计
表单标签属性值<form action="" method="">action：提交服务器的地址method：分为两种get/postget：将数据放在地址栏中提交给服务器；post：将数据打包成数据包提交给服务器表单域：<input type="" name="" id="" value="" />示例：考生信息注册表图一图二图三图四...
2022-03-24 19:28:11
1613
原创 html中＜table＞标签
1.<table>标签是html中的表格标签2.<table>的属性：border：表格四边的宽度；bordercolor:四边边框颜色；cellspacing:单元格外间距；cellpadding：单元格内填充；rules:表格间隔线设置 行列显示 rows cols all；bgcolor：背景色；align：水平对齐方式；valign:垂直对齐方式；rowspan:行合并；colspan：列合并；效果图：...
2022-03-23 19:59:50
344
原创 iframe框架
<iframe> 标签：iframe 是个内联框架，是在页面里生成个内部框架<iframe>标签属性值；src：页面地址；frameborder：边框的是否显示；scrolling:滑动条iframe框架实例：效果图：
2022-03-22 20:25:16
777
原创 Web基础知识Ⅱ
1.常用的结构化标签：h；p；ul<li;ol<li;div;span;2.行内样式标签：<b>;<strong>;<i>;<em>;<font>;<sub>;<sup>3.锚链接
2022-03-22 20:12:57
41
原创 Web基础知识
1. <h1></h1>:文章标题2.<p></p>:段落标题 <br>:换行3.<img src="" / title="" alt="">src="":图片路径；图片路径分为两种：①绝对路径：一般为网址如src="https://www.baidu.com/img/PCtm_d9c8750bed0b3c7d089fa7d55720d6cf.png"②相对路径：原本为本地图片文件如src="../img/1.j
2022-03-21 19:18:45
389
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人