青春..荒唐
- 浏览: 934617 次
- 性别:
-
最新评论
-
ouyida3：
大年初一写技术博客，牛
多种方案实现 CSS 斜线 -
青春..荒唐：
标准①lang 属性规定元素内容的语言，lang=" ...
前端面试问题总结 -
青春..荒唐：
新增1：①垂直居中一个img：img{ display: ...
前端面试问题总结 -
青春..荒唐：
新增：①事件委托：利用事件冒泡，自己所触发的事件，让父元素代替 ...
前端面试问题总结 -
田进丰：
居然还有java代码？
基于jQuery图片轮播
文章列表
【前言】
本文简单说下JS浮点数表示法(不精确)的解决方法
【主体】
Javascript采用了IEEE-745浮点数表示法，这是一种二进制表示法，可以精确地表示分数，比如1/2，1/8，1/1024。遗憾的是，我们常用的分数都是十进制分数1/10，1/100等，二进制浮点数表示法并不能精确的表示类似0.1这样的简单的数字。所以js浮点数运算会不精准。
例如：
js加法：9.3+0.3;//结果为9.600000000000001
js加法：9.3-0.7;//结果为8.600000000000001
js乘法：7*0.8;//结果为5.60000 ...
【前言】
针对之前for循环读取i值。这里记录分享下
之前文章JS中for循环出现的问题：如何给li元素绑定事件，点击每个li元素弹出对应的索引？
【主体】
（1）问题描述
如何点击某一个 li 的时候 alert 输出其index?
<ul id="test">
<li>111</li>
<li>222</li>
<li>333</li>
<li>444</li>
</ul& ...
【前言】
本文简单说下JS块级作用域相关概念
【主体】
在ES6之前，我们都是用var来声明变量，而且JS只有函数作用域和全局作用域，没有块级作用域，所以{}限定不了var声明变量的访问范围。
例如：
{
var i = 9;
}
console.log(i); // 9
ES6新增的let，可以声明块级作用域的变量。
{
let i = 9; // i变量只在 花括号内有效！！！
}
console.log(i); // Uncaught ReferenceError: i is not define ...
【前言】
本文谈下常见的一道JS面试题，let声明变量与var的区别，块级作用域等
【主体】
篇幅问题，部分放到文章JS中的let和var的区别里。
（1）面试题：接下来看到面试题
编写一个函数，该函数将遍历整数列表，并在延迟3秒后打印每个元素的索引
（2）错误写法：经常错误写法是这样的：
const arr = [10, 12, 15, 21];
for (var i = 0; i < arr.length; i++) {
setTimeout(function() {
console.log ...
【前言】
本文简单说下锚点跳转优先级
【主体】
使用锚点跳转是常用的一种方式，例如返回顶部或者快速跳转书签目录等。分为3种
（1）name值
a 标签 name 属性值为 top（可变）
<!-- 定义一个名称为top的锚点链接 -->
<a name="top"></a>
<!--主体代码-->
<!--返回页面顶部top锚点的链接-->
<a href="#top">返回顶部</a>
（2）id ...
【前言】
本文简单说下常见的几种返回顶部的方案
【主体】
（1）锚点
使用锚点链接是一种简单的返回顶部的功能实现。该实现主要在页面顶部放置一个指定名称的锚点链接，然后我们在页面下方放置一个返回到该锚点的链接，用户点击该链接即可返回到该锚点所在的顶部位置。
缺点：URL后面会添加锚点名
<!-- 定义一个名称为top的锚点链接 -->
<a name="top"></a>
<!-- 这里是网页主体内容，此处省略 -->
<!-- 返回页面顶部top锚点的 ...
【前言】
本文简单介绍下attachEvent兼容各浏览器事件（DOM2级事件的兼容处理）
【主体】
直接上代码：
<button id="btn">按钮</button>
<script type="text/javascript">
window.onload = function(){
// DOM2事件兼容
function addEvent(obj,ev,fn){
//obj为要绑定事件的元素，ev为要绑定的事件，fn为绑定事件的函数 ...
【前言】
本文简单概括下JS中字符串比较大小的注意事项
【主体】
（1）大于(>)，小于(<)运算符
JS字符串在进行大于(小于)比较时，会根据第一个不同的字符的ASCII值码进行比较，情况分为多种
①当数字跟字符串进行数学运算时(不光是>,<,=,还包括+-*/等运算)，会把字符串转换成数字
②如果字符串是数字的形式，转换成数字后就直接根据数字大小进行比较
③如果字符串不是不是数字形式，不管是'a'还是'100a'这样的形式，在转 ...
【前言】
本文简单介绍下ASCII
【主体】
（1）由来
在计算机中，所有的数据在存储和运算时都要使用二进制数表示（因为计算机用高电平和低电平分别表示1和0），例如，像a、b、c、d这样的52个字母（包括大写）以及0、1等数字还有一些常用的符号（例如*、#、@等）在计算机中存储时也要使用二进制数来表示，而具体用哪些二进制数字表示哪个符号，当然每个人都可以约定自己的一套（这就叫编码），而大家如果要想互相通信而不造成混乱，那么大家就必须使用相同的编码规则，于是美国有关的标准化组织就出台了ASCII编码，统一规定了上述常用符号用 ...
【前言】
本文简单说下if() 加大括号 和不加大括号有什么区别
简单点：有括号的话，if语句控制{}里面的所有语句，没括号的话，if语句只控制最近的一行。每句代码以分号 ; 分隔开来。
【主体】
先来看个简单的例子
demo1（if语句后跟完整语句）：
if(1<2){var a = 10,b=20,c=30;}
console.log(a,b,c)
这时满足条件，所以a,b,c都会被赋值，输出结果为10 20 30
if(1<2) var a = 10,b=20,c=30;
console.log(a,b,c ...
【前言】
今天晚上重温下春晚，早早钻被窝但不想起来关电脑，所以设置下自动关机。
这里跟大家分享个最简单的操作
【主体】
方法一：
1、按win+R打开“运行”。
2、输入“shutdown -s -t 300”。
3、点击确定即可完成。
注意事项：语句“shutdown -s -t 300”表示“300秒，即5分钟之后自动关机”，300可以换成任何整数，单位是秒。
【前言】
本文简单介绍下利用自定义属性进行正则验证，下篇文章再进行封装
【主体】
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>demo</title>
<style type="text/css">
*{
margin: 0;
padding: 0;
}
/*属性选择器*/
input[name="ph ...
【前言】
本文简单总结下弹性盒模型的元素组成
【主体】
采用flex布局的元素，被称为flex容器（flex container），简称容器。它的所有子元素会自动成为容器成员，称为flex项目（flex item），简称项目
容器存在两根轴，主轴（main axis）和纵轴即垂直的交叉轴（cross axis）。主轴开始位置为main start，结束位置main end。纵轴开始位置为cross start，结束位置cross end。
项目默认沿主轴main axis排列，单个项目占据的主轴空间叫做main size， ...
【前言】
总结讲解下弹性盒模型布局相关知识点，为以后课件做备录。本文简单讲解下Flex布局对子元素影响
【主体】
设为 Flex 布局以后，子元素的float、clear和vertical-align属性将失效
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>demo</title>
<style type="text/css">
*{
...
【前言】
本文分享个常见的特效，点击其他区域即元素外时隐藏元素。
【主体】
主要利用event事件对象（事件源）和冒泡实现
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>demo</title>
<style type="text/css">
*{
margin: 0;
padding: 0;
}
.area{
...