发表于: 2016-07-15 23:51:42
0 2866
今天的任务:了解js的基本语法。
DOM(文档对象模型)各个标签还有子节点都可以看作是DOM的元素
节点。可以通过JS中的getElementsByTagName等获取元素节点。
eg: var dome=document.getElementById("id");
jQuery对象。通过jQuery包装DOM后产生的对象。
eg:$("#foo").html();获取id为foo的元素里面的内容。
document.getElementById("foo").innerHTML;
两者相同。
///////////////////////////////////////////////////////////////////////
javascript获取元素的方法。
document.getElementById(); 通过id选取元素。
document.getElementsByTagName(); 通过标签选取元素。
document.getElementsByName(); 通过name选取元素。
document.getElementsByClassName();通过类名来选取元素。
jquery获取元素的方法
$()函数在JavaScript类库中被用作一个选择器函数使用。
eg:$('#') $('.') $('div') $('*') $('A,B') $('A B')
$('A>B') $('A>B') $('A+B') $('A~B')
$("id")用来替代document.getElementById()函数。
$("tagName")用document.getElementByTagName()函数。
////////////////////////////////////////////////////////////////////////
$(document).ready(function(){
})
这段代码和JavaScript中的window.onload方法相类似。
区别:
window.onload必须等待页面中所有的内容加载完毕后,
包括图片才能执行。并且不能同时编写多个。
$(document).ready()网页中所有DOM结构绘制完毕后执行。DOM元素相关
联的东西并没有加载完。能够同时编写多个。一般都简写成
$(function(){
//..
})
////////////////////////////////////////////////////////////////////////
关于 mobile web的开发
px, CSS逻辑像素,浏览器使用的抽象单位
dp,pt; device independent 设备无关像素(物理像素)
dpr 设备像素缩放比
平面上 1px=(dpr)^2 * dp
纬度上 1px=dpr*dp
拿iphone5为例 物理像素640px *1136px 默认的dpr为2
根据上面的公式
平面上(横向*纵向) 1dp=4px
纬度上(单向) 1dp=2px
所以iphone5的逻辑像素为 320px*568px.
为什么像素缩放比为2.
dpi:打印机每英寸可以喷的点数。
ppi:屏幕每英寸的像素数量。
ppi=屏幕对角线的像素数/屏幕的尺寸
iphone5 ppi=√(6402+11362) /4=326ppi
ldpi mdpi hdpi xhdpi
ppi 120 160 240 320
默认缩放比 0.75 1.0 1.5 2.0
明天的任务:
$('A:first') $(A:last) $('A:not(selector)') $('A:even')
$('A:gt(index)') $('A:It(index)') $('A:header') $('A:animataed')
选择器的熟悉。
评论