html css js 细节
细节1
1.Chrome中文界面下会将小于12px的字体默认显示为12px,解决方法:在CSS中加入-webkit-text-size-adjust:none;
2.link可以加载除CSS以外的其他文档,@import只能加载CSS
3.IE下,可以使用普通方法获取自定义属性,也可以使用getAttribute()方法获得自定义属性,
在FireFox下只能使用getAttribute()获得自定义属性,解决方法,统一用getAttribute()方法。
4.超链接在被点击访问过以后就不显示了,不在具有hover和active属性,
这是CSS属性顺序排列错误,争正确的排列顺序为:link-visited-hover-active
5.支持HTML5的新标签:
IE6/7/8下可以通过document.createElement方法产生新的标签,利用这个方法让浏览器支持HTML5的新标签。
6.iframe缺点:
iframe会阻塞主页面的onload事件
iframe会影响页面的并行加载(因为iframe和主页面共享一个连接池,而浏览器对相同域的连接有限制)。
解决方法:通过javascript动态的为iframe添加src属性,可以绕开上面两个缺点。
7.盒模型包括IE盒模型和W3C标准盒模型,IE盒模型中content包括了padding和border
盒模型:content、padding、border、margin
8.可继承的样式:font-size,color,font-family
不可继承的样式:marging,padding,border,width,height
优先级:!important>id>class>标签
!important比内联样式权重高
9.内联元素的高度宽度都是不可以设置的,其宽度就是自身文字或者图片的宽度
10. for(var i in foo) {
if (foo.hasOwnProperty(i)) {
console.log(i);
str=str+i;
}
} 11.删除属性的唯一方法是使用 delete 操作符;
设置属性为 undefined 或者 null 并不能真正的删除属性, 而仅仅是移除了属性和值的关联。
var obj = {
bar: 1,
foo: 2,
baz: 3
};
obj.bar = undefined;
obj.foo = null;
delete obj.baz; 12.JavaScript 中所有变量都可以当作对象使用,除了两个例外 null 和 undefined 。
13.有两种方式来访问对象的属性,点操作符或者中括号操作符。
14.变量声明:变量的声明只有一种方式,那就是用var关键字声明,
直接赋值不是一种声明方式。这仅仅是在全局对象上创建了新的属性(而不是变量)。
变量不能删除(delete),属性可以删除。
在“eval”的上下文中,变量是可以删除的: 15.( function(){…} )()和( function (){…} () )是两种javascript立即执行函数的常见写法,
()、!、+、-、=等运算符,都将函数声明转换成函数表达式,
消除了javascript引擎识别函数表达式和函数声明的歧义,
告诉javascript引擎这是一个函数表达式,不是函数声明,
可以在后面加括号,并立即执行函数的代码。
细节2
1.http://ftp.mozilla.org/pub/firefox/releases/
2.
// 12.从url中获取参数值
function getQueryString(name) {
var search = location.search.substring(1),
reg = new RegExp("(^|&)" + name + "=([^&]*(&|$))", "i"),
r = search.match(reg);
if (r != null) {
return r[2];
}
return null;
}
console.log(getQueryString('MatchID'));
3.Object作为一个机器可以看做是有由Function制造出来的,
而Function作为一个对象可以看做是由Object制造出来的。
这就是JavaScript世界的“鸡生蛋,蛋生鸡”问题。那么到底是谁生了谁呢?Whatever!
4.数组有 indexOf 这个方法(严格等于(===),而 字符串的indexOf 方法是 等于(==))。
5.arrayObject.splice(index,howmany,item1,.....,itemX),
splice() 方法可删除从 index 处开始的零个或多个元素,
并且用参数列表中声明的一个或多个值来替换那些被删除的元素。
6.:将父容器设置成 table,需要竖直居中的元素设置为 table-cell,
然后就可以使用 vertical-align 属性来居中了
7.使用绝对定位的方法,并借助 margin 可以为负值的特性,实现绝对定位居中:
* 已知元素高度为 100px (也可以是百分比,如 80%)*/
height: 100px; /* 先使用绝对定位,将元素的上边界置于竖直的中间*/
position: absolute;
top: 50%; /* 再使用margin-top,将元素向上移动自身高度的一半*/
margin-top: -50px; 8.块级元素高度不固定
/* 先将元素的上边界置于竖直的中间*/
position: relative;
top: 50%; /* 再使用 translateY,将元素向上移动自身高度的一半*/
transform: translateY(-50%);
9.
function A(){
this.name='lala';
}
var a=new A();
console.log(A.prototype,a.prototype);
console.log(A.__proto__,a.__proto__);
10.
substr() 方法可在字符串中抽取从 start 下标开始的指定数目的字符。
substring() 方法用于提取字符串中介于两个指定下标之间的字符。 stringObject.substring(start,stop)
stop
可选。一个非负的整数,比要提取的子串的最后一个字符在 stringObject 中的位置多 1。
如果省略该参数,那么返回的子串会一直到字符串的结尾。 11.javascript:navigator.userAgent
12.计算代码运行时间
var times = 15000;
// code1 每次过桥+重排+重绘
console.time(1);
for(var i = 0; i < times; i++) {
document.getElementById('myDiv1').innerHTML += 'a';
}
console.timeEnd(1); // code2 只过桥
console.time(2);
var str = '';
for(var i = 0; i < times; i++) {
var tmp = document.getElementById('myDiv2').innerHTML;
str += 'a';
}
document.getElementById('myDiv2').innerHTML = str;
console.timeEnd(2);
细节3
1.常用元素属性(offsetHeight属性需要返回最新的布局信息, 因此浏览器不得不执行渲染队列中的“待处理变化”
并触发重排以返回正确的值(即使队列中改变的样式属性和想要获取的属性值并没有什么关系),)
offsetTop, offsetLeft, offsetWidth, offsetHeight
scrollTop, scrollLeft, scrollWidth, scrollHeight
clientTop, clientLeft, clientWidth, clientHeight
优化重排
var ele = document.getElementById('myDiv');
// 1. 重写style
ele.style.cssText = 'border-left: 1px; border-right: 2px; padding: 5px;';
// 2. add style
ele.style.cssText += 'border-;eft: 1px;'
// 3. use class
ele.className = 'active';
2."四舍六入五成双"含义: 对于位数很多的近似数,当有效位数确定后,其后面多余的数字应该舍去,只保留有效数字最末一位,
这种修约(舍入)规则是“四舍六入五成双”,
也即“4舍6入5凑偶”这里“四”是指≤4 时舍去,"六"是指≥6时进上,
"五"指的是根据5后面的数字来定
当5后有数时,舍5入1;
当5后无有效数字时,需要分两种情况来讲
:①5前为奇数,舍5入1;②5前为偶数,舍5不进。(0是偶数)
html css js 细节的更多相关文章
- css,js工具篇
4. web前端开发分享-css,js工具篇 web前端开发乃及其它的相关开发,推荐sublime text, webstorm(jetbrains公司系列产品)这两个的原因在于,有个技术叫emm ...
- 前端工程师面试问题归纳(一、问答类html/css/js基础)
一.参考资源 1.前端面试题及答案整理(一) 2.2017年前端面试题整理汇总100题 3.2018最新Web前端经典面试试题及答案 4.[javascript常见面试题]常见前端面试题及答案 5.W ...
- css+js实现自动伸缩导航栏
用css+js实现自动伸缩导航栏 需要达到的效果: 默认首页选中样式 设置鼠标滑过效果:颜色变化(#f60),宽度变化,字体变化 所涉及的知识点: 布局:float css: 元素状态切换(displ ...
- #1使用html+css+js制作网站教程 准备
#1使用html+css+js制作网站教程 准备 本系列链接 0 准备 0.1 IDE编辑软件 0.2 浏览器 0.3 基础概念 0.3.1 html 0.3.2 css 0.3.3 js 0.4 文 ...
- CSS & JS 制作滚动幻灯片
==================纯CSS方式==================== <!DOCTYPE html> <html> <head> <met ...
- 【转】Maven Jetty 插件的问题(css/js等目录死锁)的解决
Maven Jetty 插件的问题(css/js等目录死锁,不能自动刷新)的解决: 1. 打开下面的目录:C:\Users\用户名\.m2\repository\org\eclipse\jetty ...
- Css Js Loader For Zencart
Css Js Loader 描述:这个插件很早就出来了,可能知道人非常少 这个插件的功能是整合所有的网站的CSS和JS内容到一个文件里边. 因为CSS和JS文件到了一个文件,加快了程序的运行 在配合其 ...
- 购物车数字加减按钮HTML+CSS+JS(有需要嫌麻烦的小伙伴拿走不谢)
之前在写详情页的时候,如下图 因为自己嫌麻烦,就去看其他网站是怎么写的,想直接拿来用,后来看来看去觉得写得很麻烦,于是最后还是决定自己写,附上HTML+CSS+JS代码,一条龙一站式贴心服务2333 ...
- vs合并压缩css,js插件——Bundler & Minifier
之前做了一个大转盘的抽奖活动,因为比较火,部分用户反馈看不到页面的情况,我怀疑js加载请求过慢导致,所以今天针对之前的一个页面进行调试优化. 首先想到的是对页面的js和css进行压缩优化,百度了下vs ...
随机推荐
- ERP项目实施记录10
好久没有更新,因为进度一直拖着.已经实施了20个月了,很多东西没有开发出来.原因多方面的,虽然在此打算吐槽一下开发公司,但其实很大部分责任还是在我们自己. 不多说了,看图:
- 找不到main
用eclipse写代码的时候,写了一个简单的程序,编译的时候突然出现“错误: 在类 com.test.demo 中找不到 main 方法, 请将 main 方法定义为: public static v ...
- mysql提权常用方法。 hack某某
一般是root权限,知道mysql root权限,root账号密码 启动项提权:原理:利用高权限的root写入一个vbs脚本到启动项,再通过一些方法如ddos,社工管理员之类的方法来让服务器重启,运行 ...
- Java学习-049-正则工具类
自去年九月份决定再次入学和职业资格进阶,开始备战二者考试至今,以及当下进行中的职称申请,犹如孤独的狼,不断前行在路上,而今凡凡总总的已历8月... 不感慨了,如下为一园友需要的正则工具类,直接上码: ...
- 小程序map组件默认层级最高,并且不能设置的解决方案
map组件默认在最上面,若要设置像ofo那样的按钮有两个方法,一是用控件设置,控件就是controls属性,控件只能显示图片,不能显示文字之类的.二是用cover-view组件,这个组件就是悬浮在一些 ...
- Address already in use: AH00072: make_sock: could not bind to address 0.0.0.0:443
(1)端口被占用,找到对应的进行并结束.(2)Linux下查看,无进程占用443端口,确认/etc/httpd/conf.d下只有一个ssl.conf,无其他SSL配置.备份文件,如果有,apache ...
- windows下cmd无法使用telnet命令解决方法 (原)
telnet不是内部或者外部命令,也不是可运行程序-----解决办法: (win7为例) 控制面板 --- > 程序(小图标下直接到[程序和功能]) --- >程序和功能 --- > ...
- C语言进阶之路(二)----字符串操作常见模型
1.while模型 #define _CRT_SECURE_NO_WARNINGS #include <stdio.h> #include <stdlib.h> #includ ...
- sublime lincense for linux
sublime lincense for linux Sublime Text 3.x (after Build 3133) —– BEGIN LICENSE —–TwitterInc200 User ...
- Cycle (KMP + hash)
题意:给你2个串,让你判断2个字符串的前缀是否满足首尾连接形成的环是不是一样的. 思路:我们需要提前知道的是满足条件的前缀一定满足 strA = str1 + str2, strB = str2 + ...