css BFC BFC是什么?BFC(Block formatting context)直译为”块级格式化上下文”。它是一个独立的渲染区域,它规定了内部的Block-level Box如何布局,并且与这个区域外部毫不相干。 怎么生成BFC1、position为absolute或fixd; 2、float属性不为none; 3、diaplay为inline-block, table-cell, table
retina屏 1px变宽问题的理解和解决方法 引出:这是移动端开发常遇到的问题,自己虽没做过移动端,但是感觉这是一个坑,所以记录下来,以后备用。为什么border:1px看起来比1px要宽呢?网上查了一下发现,这里的2个1px实际含义是不一样的,viewport 的设置和屏幕物理分辨率是按比例而不是相同的. 移动端 window 对象有个 devicePixelRatio 属性, 它表示设备物理像素和 css 像素的比例, 在 retina
原生js实现轮播 好久之前项目中用到的demo,当时写的时候算是又学了一边css.<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <style> *{ padding: 0; margin: 0;} div{ width
CSS清除浮动 在项目的实际开发过程中,经常会遇到浮动样式float。float带来方便的同时,也带来了一些麻烦,浮动核心就一句话:浮动元素会脱离文档流并向左/向右浮动,直到碰到父元素或者另一个浮动元素。首先要知道,div是块级元素,在页面中独占一行,自上而下排列,也就是传说中的流。如下图: 可以看出,即使div1的宽度很小,页面中一行可以容下div1和div2,div2也不会排在div1后边,因为div元素是独
js 对象浅拷贝、深拷贝 对于对象这种内存占用比较大的来说,直接让复制的东西等于要复制的,那么就会发生引用,因为这种复制,只是将复制出来的东西的指向指向了要复制的那个东西,简单的说,就是两个都同时指向了一个空间,如果改变其中一个,另一个也会发生变化。这就发生了引用。 1、数组浅拷贝var arr1=[1,2,3,4,5];var arr2=arr1;arr2.push(6);console.log(arr1);/
三栏布局 1、两边固定,中间自适应1.1使用position:absolute和margin,这或许是三种方法里最直观,最容易理解的:左右两栏采用绝对定位,分别固定于页面的左右两侧,中间的主体栏用左右margin值撑开距离。于是实现了三栏自适应布局。<!DOCTYPE html><html><head> <title></title></head><style type="text/css"
css 隐藏元素的方法 { display: none; /* 不占据空间,无法点击 */ }{ visibility: hidden; /* 占据空间,无法点击 */ }{ position: absolute; clip:rect(1px 1px 1px 1px); /* 不占据空间,无法点击 */ }{ position: absolute; top: -999em; /* 不占据空间,无法点击 */ }{
数组去重总结 var arr=[‘apple’, ‘strawberry’, ‘banana’, ‘pear’, ‘apple’, ‘orange’, ‘orange’, ‘strawberry’,1,3,6,3];arr.filter(function(e,i,self){return self.indexOf(e)==i;})//["apple", "strawberry", "banana", "pea
css position 1、static(静态定位):默认值。没有定位,元素出现在正常的流中(忽略 top, bottom, left, right 或者 z-index 声明)。2、relative(相对定位):生成相对定位的元素,通过top,bottom,left,right的设置相对于其正常(原先本身)位置进行定位。可通过z-index进行层次分级。 3、absolute(绝对定位):生成绝对定位的元素,相对于 s
this指向 this始终指向运行其运行环境所在的对象,而不是声明环境所在的对象 普通函数function person(){ this.name="zhang"; console.log(this);//window console.log(this.name);//zhang }person()在这段代码中person函数作为普通函数调用,实际上person是作为全局对
原型与原型链 一、什么是原型? 原型?什么是原型呢?红宝书上说原型是js中声明对象的一种方式,另外两种方式是工厂模式、构造函数模式。下面分别来举个例子。1、工厂模式:function Person(name,age,job){ var o=new Object(); o.name=name; o.age=age; o.job=job; o.sayName=funct
HTTP Http(Hyper Text Transfer Protocol,超文本传输协议)1、特点 a、http是无连接的,无连接的含义是限制每次连接只处理一个请求。服务器处理完客户的请求,并收到客户的应答后,即断开连接。采用这种方式可以节省传输时间。 b、http是无状态的,无状态是指协议对于事务处理没有记忆能力。缺少状态意味着如果后续处理需要前面的信息,则它必须重传,这样可能导致每次连接传送的数据
reduce() var attr=["a","a","a","b","b","c","d","e"] function getNum(){ var obj={}; for(var i=0;i<attr.length;i++){ var item=attr[i]; console.log(item);
js闭包 1. 什么是闭包 闭包(closure)官方定义:闭包,指的是词法表示包括不被计算的变量的函数,也就是说,函数可以使用函数之外定义的变量。 在js中,由于函数作用域的限制,外部的函数无法读取内部的局部变量,当我们要取这个局部变量的时候可以通过在局部变量所定义函数内部再定义一个函数,新定义的这个函数就是闭包。 2.闭包的特点: a.可以读取函数内部的变量; b.闭包使局部变量始终保存
页面优化的方法 1、减少HTTP请求CSS Sprites2、使用CDN3、添加Expires头页面的初次访问者会进行很多HTTP请求,但是通过使用一个长久的Expires头,可以使这些组件被缓存,下次访问的时候,就可以减少不必要的HTPP请求,从而提高加载速度。4、压缩组件5、将样式表放在头部首先说明一下,将样式表放在头部对于实际页面加载的时间并不能造
ajax工作原理 ajax工作原理**(1)**ajax的全称是Asynchronous JavaScript and XML,异步的javaScript和XML。ajax是一种用于创建快速动态网页的技术,通过在后台与服务器进行少量的数据交换,ajax可以使网页实现异步更新。 (2)同步和异步:异步传输是面向字符的传输,它的单位是字符;而同步传输是面向比特的传输,它的单位是桢,它传输的时候要求接受方和发送方的时钟是
js跨域的几种方式: js跨域的几种方式:(1)iframe标签+document.domain 此方法针对对于主域相同而子域不同的例子 页面a.html要访问b.html a.html: b.html: (2)jsonp(JSONP只能实现GET请求)所有的浏览器都遵守同源策略(JavaScript是一种在Web开发中经常使用的前端动态脚本技术。在JavaScript中,有一个很重要的安全性限制,被称为“
document.getElementsByTagName(“#”)获取的对象的集合 纯js中有时需要获取元素,document.getElementTagName("#")方法获取的是元素的集合,例如在给元素定义元素时 ,需要这样写var x=document.getElementByTagName("div");x[0.style.backgroundColor("red");
遍历js对象的元素 点击下面的按钮,循环遍历对象 "person" 的属性。点击这里function myFunction(){var x;var txt="";var person={fname:"Bill",lname:"Gates",age:56}; for (x in person){alert(person[x]);txt=txt + pers