HTML5随记
1、浏览器加载HTML的过程是从上至下,因此引用的第三方js文件一定要放到自己定义的js文件的前面,否则引入的js文件将会在加载时失效。
2、html的全局属性包括:accesskey、contenteditable、dir、hidden、tabindex、class、id、style
3、css属性:background-color元素背景色,color元素前景色
4、css尺寸:绝对长度和相对长度。其中相对长度有em、ex、px、rem、%,其中em是与字号挂钩的相对单位,1em表示1个字体高度。1ex大约等于0.5em
5、javascript中的undefined和null的区别:undefined是没有定义该变量,null是定义了该变量但是无值。做判空处理的时候,两者都要做判断,或者直接使用逻辑!运算符。
//下面两种方式都可以
if (city.name==null || city.name==undefined) {}
if(!city.name){}
6、HTML元素一共可分为下面几大类:文档和元数据元素、文本元素、内容分组元素、页面分组元素、制表元素、表单元素、内容嵌入元素。
文档和元数据元素:DOCTYPE、html、head、body、base、link、mata、script、noscript、style、title
文本元素:a、abbr、b、br、cite、code、del、dfn、em、i、ins、kbd、mark、q、rp、rt、ruby、s、samp、small、span、strong、sub、sup、time、u、var、wbr
内容分组元素:blockquote、dd、div、dl、dt、figcaption、figure、hr、li、ol、ul、p、pre、
页面分组元素:address、article、aside、details、footer、h1~h6、header、hgroup、nav、section、sumary
制表元素:caption、col、colgroup、table、tbody、tfoot、th、td、tr、thead、
表单元素:button、datalist、fieldset、form、input、keygen、label、legend、optgroup、option、output、select、textarea
内容嵌入元素:area、audio、canvas、embed、iframe、、img、map、meter、object、param、progress、source、svg、track、video
7、js中数组和对象的关系
//js中数组就是对象,可以在数组中定义属性,但是其数据并不存在数组结构中
var city={};
city.name="shanghai";
console.log(city["name"]);//shanghai
console.log(city.name);//shanghai var person=[];
person.name="zhangsan";
console.log(person["name"]);//zhangsan
console.log(person.name);//zhangsan
console.log(person[0]);//undefined
//未索引到数据,说明上面定义的“zhangsan”并不存在数组结构中
person.push("lisi");//向数组中添加数据
console.log(person[0]);//lisi
console.log(person[1]);//undefined
console.log(person["name"]);//zhangsan
//进一步证实上面的结论
通过上面的代码可以证实,js中索引数组结构中的数组只能通过位置索引,并不存在说是通过名称索引。而通过名称索引的数据,其实是数组对象中定义的属性值。
8、解决表格中文字显示过长的问题
css样式:
table {
table-layout: fixed;!important
}
tr td {
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
html:
<td title="xxxxxxxxxxxxx">xxxxxxxxxxxxx</td>
效果:

9、js中计算中文文字长度,或者中英文混合长度
var jmz = {};
jmz.GetLength = function(str) {
return str.replace(/[\u0391-\uFFE5]/g,"aa").length; //先把中文替换成两个字节的英文,在计算长度
};
HTML5随记的更多相关文章
- HTML5 乱记
HTML5 的文档类型声明可以触发所有具备标准模式的浏览器的标准模式,包括那些对 HTML5 一无所知的浏览器,也就是说,可以在任何网页中都使用 HTML5 文档类型声明 <!DOCTYPE h ...
- 浅谈html5 video 移动端填坑记
这篇文章主要介绍了浅谈html5 video 移动端填坑记,小编觉得挺不错的,现在分享给大家,也给大家做个参考.一起跟随小编过来看看吧 本文介绍了html5 video 移动端填坑记,分享给大家,具体 ...
- html5 web worker学习笔记(记一)
(吐槽:浏览器js终于进入多线程时代!) 以前利用setTimeout.setInterval等方式的多线程,是伪多线程,本质上是一种在单线程中进行队列执行的方式.自从html5 web worker ...
- 一场属于HTML5守望者的盛宴——记图灵参加HTML5峰会
2013年8月,北京正是一个火热的季节.一场火热的盛会,HTML5 峰会如约来袭.这是一场属于 HTML5 守望者的盛宴!HTML5作为一项新兴的技术,其未来是光明的,但是道路却是曲折的.需要标准的不 ...
- 记一次奇葩事——html5可能不支持window.onscroll函数
只在html5里遇到,html4没事:拿出来聊聊,路过帮忙解答下!!! 不正常的 <!doctype html><html><head><meta chars ...
- html5 01 随记
一 HTML 是一种制作网站的标记语言 二.HTML基本语法 HTML 标签 html标签是html中的最基本单位 也是最重要的部分 通常使用尖角号 开始"<"和结束&qu ...
- html5 02 随记
HTML 02 全局通用属性 id name class style 一. 图像标签 标签名:<img /> 常用属性: Alt -- 代表图像的替代文字 作用: 当图片不显示的 ...
- 几行代码把Chrome搞崩溃之:HTML5 MP3录音由ScriptProcessorNode升级成AudioWorkletNode采坑记
关键词: STATUS_ACCESS_VIOLATION AudioContext AudioWorkletNode audioWorklet addModule resume suspended c ...
- 如何开发一个简单的HTML5 Canvas 小游戏
原文:How to make a simple HTML5 Canvas game 想要快速上手HTML5 Canvas小游戏开发?下面通过一个例子来进行手把手教学.(如果你怀疑我的资历, A Wiz ...
随机推荐
- css将两个元素水平对齐,兼容IE8
css实现元素水平对齐 css实现水平对齐,如图 有人会说css实现这种水平对齐要兼容ie8还不简单吗?使用float: left,或者display: inline-block,不就可以了吗?是的, ...
- Markdown的使用和计算机基础
TOC] 一级标题 这不是开玩笑 你问我为什么? 粗的才好(滑稽) 什么!明明有人推我 ==一闪一闪亮晶晶== 我上面有人^人在这^ water?H~2~O(下标) hello world! hell ...
- 移动web开发之像素和DPR详解
前话: 像素在web开发中几乎天天用到,但到底什么是像素,移动端和桌面端的像素有区别吗,缩放对像素有影响吗,视网膜屏幕和像素有什么关系?关于这些问题,可能就不清楚了.本文将介绍关于像素的相关知识 什么 ...
- LeetCode--062--不同路径(python)
一个机器人位于一个 m x n 网格的左上角 (起始点在下图中标记为“Start” ). 机器人每次只能向下或者向右移动一步.机器人试图达到网格的右下角(在下图中标记为“Finish”). 问总共有多 ...
- SQL SERVER 数据库如何限制一列不能重复(已经有主键)
ALTER TABLE 表名ADDCONSTRAINT 约束名 UNIQUE (列名) -------------------------------------------------------- ...
- 开发 .swan 文件
这部分是每个智能小程序页面的展现模板,类似于 Web 开发中的 HTML ,SWAN 模板中使用的标签均为 SWAN 组件规定的标签. <view s-for="item in ite ...
- websocket 传输数据帧打包 (client端)
/* Vertion: 0.2.1 date: 2015.8.11 content: gcc 编译通过 */ //websocket 传输数据帧打包 client端 //参数:src 为输入字符串 / ...
- [洛谷P3938]:斐波那契(fibonacci)(数学)
题目传送门 题目描述 小$C$养了一些很可爱的兔子.有一天,小$C$突然发现兔子们都是严格按照伟大的数学家斐波那契提出的模型来进行繁衍:一对兔子从出生后第二个月起,每个月刚开始的时候都会产下一对小兔子 ...
- 正则表达式小结,数据预处理中常用的shell命令
数据预处理中,这部分命令非常有用. 不需要编写代码,直接通过shell脚本通常就能修改文件格式.有时候sed和awk联合几乎能实现所有功能. 管道命令 | 重定向命令>,2>,>&g ...
- 北风设计模式课程---开放封闭原则(Open Closed Principle)
北风设计模式课程---开放封闭原则(Open Closed Principle) 一.总结 一句话总结: 抽象是开放封闭原则的关键. 1."所有的成员变量都应该设置为私有(Private)& ...