![](https://img-blog.csdnimg.cn/20201014180756927.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
前端
端脑
这个作者很懒,什么都没留下…
展开
-
jQuery 3
jQuery属性节点什么是属性?对象身上保存的变量就是属性如何操作属性?对象.属性名称 = 值;对象.属性名称;对象[“属性名称”] = 值;对象[“属性名称”];什么是属性节点?<span name = “it666”>在编写HTML代码时,在HTML标签中添加的属性就是属性节点在浏览器中找到span这个DOM元素之后, 展开看到的都是属性在attributes属性中保存的所有内容都是属性节点如何操作属性节点?DOM元素.setAttribute(“属性名称”,原创 2020-07-18 07:55:14 · 138 阅读 · 0 评论 -
jQuery 2
jQuery的冲突问题因为什么引起的冲突?打个比方: $这个符号,如何引入的js代码之中,出现在引入的好几个js文件中。那么将会使用最后引入的js规则<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>05-jQuery冲突问题</title> <script src="js/jquery-1.12.4.js">原创 2020-07-15 08:13:51 · 144 阅读 · 0 评论 -
jQuery
jQuery原生 JS 和 jQuery 的区别原创 2020-07-14 16:34:13 · 121 阅读 · 0 评论 -
事件委托小白入门篇
事件委托好处概述为什么要用事件委托事件委托初体验事件委托常用做法思考问题总结事件委托事件委托的好处可以对后面新添加的元素也有效提升了效率返回顶层概述 什么叫事件委托呢? 它还有一个名字叫事件代理,JavaScript高级程序设计上讲:事件委托就是利用事件冒泡,只指定一个事件处理程序,就可以管理某一类型的所有事件。 那这是什么意思呢?网上的各位大牛们讲事件委托基本上都用了同一个例子,就是取快递来解释这个现象,我仔细揣摩了一下,这个例子还真是恰当,我就不去想别的.原创 2020-06-03 11:12:04 · 171 阅读 · 0 评论 -
JS事件详解
事件预先定义好的标准行为。 比如鼠标单击,鼠标双击。。等等事件三要素事件源事件名称事件处理程序js处理事件事件源.事件 = 事件处理程序事件源.事件 = function(){ //事件处理函数。事件处理函数 必须等事件发生后才执行。 }onclick事件onload事件onmouseover事件onmouseout事件onchange事件onfocusonblur键盘事件事件对象事件对象常用坐标属性图片原创 2020-05-30 08:44:46 · 212 阅读 · 0 评论 -
JS —— 闭包
变量作用域闭包的概念变量作用域两种变量作用域:全局变量局部变量理解下面三段JS函数var n=999; function f1(){ alert(n); } f1(); // 999function f1(){ var n=999;} alert(n); // errorfunction f1(){ n=999;...原创 2020-02-26 15:52:10 · 188 阅读 · 0 评论 -
小白快速入门篇---HTML+CSS+JS
1. HTML封神之路 — 目录2. CSS封神之路 —— 目录原创 2019-11-04 14:09:30 · 607 阅读 · 1 评论 -
原型
原型原型链原型与原型链细致讲解的参考属性对象的查找方法原型的注意事项原型任何函数都有一个prototype属性 它是一个对象 原型对象只不过原型对普通函数没有多大意义<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8">...原创 2020-02-24 09:52:21 · 198 阅读 · 0 评论 -
Date
Date<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv...原创 2020-02-21 15:04:32 · 92 阅读 · 0 评论 -
Math常用的属性和方法
Math常用的属性和方法<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title></head><body> <script type="text/j...原创 2020-02-21 15:01:12 · 271 阅读 · 0 评论 -
导航栏
简易导航栏简易导航栏<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <style type="text/css"> /* 重置元素的默认样式*/ * ...原创 2020-02-18 11:17:47 · 190 阅读 · 0 评论 -
阴影样式
样式图例一样式图例二样式一代码<html><head> <title></title> <style type="text/css">/*<!-- ———————————— 最简单的常规效果 —————————————————————— -->*/.flex{display:flex;...原创 2020-02-17 21:39:33 · 320 阅读 · 0 评论 -
碰撞的小球
碰撞的小球<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equi...原创 2019-12-16 16:11:48 · 110 阅读 · 0 评论 -
打气球
打气球<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv=...原创 2019-12-16 16:10:36 · 154 阅读 · 0 评论 -
案例二:行走的小女孩
案例二:行走的小女孩<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta htt...原创 2019-12-16 15:53:29 · 259 阅读 · 0 评论 -
案例一:红绿灯
红绿灯<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv...原创 2019-12-16 15:33:26 · 312 阅读 · 0 评论 -
构造函数
构造函数<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv...原创 2019-12-16 09:54:59 · 110 阅读 · 0 评论 -
复习
复习<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="...原创 2019-12-16 09:50:13 · 77 阅读 · 0 评论 -
自定义类
自定义类<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equi...原创 2019-12-16 09:44:33 · 134 阅读 · 0 评论 -
call、apply、bind、高阶函数
apply与call方法<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta h...原创 2019-12-16 09:36:31 · 229 阅读 · 1 评论 -
函数的上下文
函数的上下文<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equ...原创 2019-12-16 09:23:51 · 212 阅读 · 0 评论 -
对象
狭义对象<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv...原创 2019-12-16 08:57:28 · 154 阅读 · 0 评论 -
小球重力加速度
小球重力加速度<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-eq...原创 2019-12-15 10:35:39 · 389 阅读 · 0 评论 -
小球圆周运动
小球圆周运动<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-eq...原创 2019-12-15 10:34:28 · 979 阅读 · 0 评论 -
广告两侧跟随效果
广告两侧跟随效果<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title></title> <style> img { position: absolute; ...原创 2019-12-15 10:32:24 · 187 阅读 · 0 评论 -
弹幕效果
弹幕效果<!doctype html><html lang="en"><head> <meta charset="UTF-8" /> <title>Document</title> <style type="text/css"> *{ margin: 0; padding: 0;} #box{ ...原创 2019-12-15 10:29:44 · 107 阅读 · 0 评论 -
右下角菜单悬浮效果
右下角菜单悬浮效果<!DOCTYPE html><html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>无标题文档</title><style type="text/css">*{m...原创 2019-12-15 10:27:04 · 498 阅读 · 0 评论 -
手风琴效果
手风琴效果<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title></title> <style> ul { list-style: none }...原创 2019-12-15 10:22:38 · 135 阅读 · 0 评论 -
添加至购物车
添加至购物车<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equ...原创 2019-12-15 10:14:17 · 525 阅读 · 0 评论 -
对象
对象<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title></head><body> <script type="text/javascript...原创 2019-12-14 13:57:25 · 116 阅读 · 0 评论 -
client家族 / offset家族 / scroll家族
client家族client家族<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <style type="text/css"> .box ...原创 2019-12-14 13:42:11 · 176 阅读 · 0 评论 -
事件传播机制
事件传播机制DOM0级DOM2级DOM0级事件绑定的方法都是在当前元素事件行为的冒泡阶段执行:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <styl...原创 2019-12-14 12:30:09 · 552 阅读 · 0 评论 -
打字练习
打字练习demo.html<html> <head> <meta charset="utf-8"> <title>打字游戏</title> <!--引入animate.css动画库--> <link rel="stylesheet" href="...原创 2019-12-14 10:43:21 · 179 阅读 · 2 评论 -
window对象
JavaScript Window - 浏览器对象模型(BOM)window对象之定时器window.locationopen方法 — 父子窗口倒计时window对象之定时器<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>D...原创 2019-12-13 17:02:47 · 140 阅读 · 0 评论 -
轮播图
轮播图<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>图片轮播的两种方式</title> <style> #controls { width:400px; margin: auto; text...原创 2019-12-13 16:02:33 · 105 阅读 · 0 评论 -
DOM节点
DOM节点返回目录原创 2019-12-12 23:34:17 · 192 阅读 · 0 评论 -
DOM的操作
操作返回目录原创 2019-12-12 22:32:55 · 174 阅读 · 0 评论 -
DOM树的使用
访问并更新DOM树的两个步骤定位到与需要操作的元素的对应节点。使用它的文本、子元素或属性。访问元素选择单个元素节点getElementById()querySelector()选择多个元素getElementByClassName()getElementByTagName()querySelectorAll()在元素节点之间遍历pare...原创 2019-12-12 22:03:11 · 174 阅读 · 0 评论 -
文档对象模型 (DOM)
DOM简介文档对象模型 (DOM) 是HTML和XML文档的编程接口。API (web 或 XML 页面) = DOM + JS (脚本语言)。DOM树:DOM树主要由四个主要节点组成文档节点当需要访问任何元素、属性或文本节点时,都需要通过文档节点来进行导航。元素节点需要访问DOM树时,需要从查找元素开始属性节点属性节点不是元素所在的...原创 2019-12-12 21:10:57 · 221 阅读 · 0 评论 -
JS字符串
字符串属性和方法属性:lengthprototypeconstructor方法:charAt()charCodeAt()concat()fromCharCode()indexOf()lastIndexOf()match()replace()search()slice()split()subst...原创 2019-12-10 11:24:12 · 196 阅读 · 0 评论