DIV CSS 佈局教程網

jquery庫文件略龐大，在某些情況下，需要盡量減少加載的文件（文件大小），需要用純js來編寫效果

$('#layer')
document.getElementById('layer')

$('#layer span')
var layer = document.getElementById('layer');
var span = layer.getElementsByTagName('span');

$('#inner').parent()
document.getElementById("inner").parentNode

$(window).width();
document.body.clientWidth

$('#layer').width();
document.getElementById('layer').style.width

$('#wrap').append('<span>a</span>');
var span=document.createElement("span");
span.innerHTML='a';
document.getElementById("wrap").appendChild(span);

$('#wrap span').remove();
deleteSpan();
function deleteSpan(){
var content=document.getElementById("wrap");
var childs=content.getElementsByTagName("span");
if(childs.length > 0){
content.removeChild(childs[childs.length-1]);
deleteSpan();
}
}

$('#wrap').css({'left':'100px'});
var wrap = document.getElementById('wrap');
wrap.style.left = '100px';

$('#banner').hide();
document.getElementById('banner').style.display = 'none';

$('#banner').show();
document.getElementById('banner').style.display = 'block';

$('#people').addClass('people_run2');
document.getElementById("people").classList.add('people_run2');

$('#people').removeClass('people_run1');
document.getElementById("people").classList.remove('people_run1');

$('#number').text(1);
document.getElementById('number').innerHTML = 1;

$.ajax({ 
type: "POST", 
url: 'run.php', 
data: 's='+last_step, 
dataType:"JSON", 
timeout: 2000, 
success: function(data){ 
//處理回調 
} 
}); 

//1.創建XMLHTTPRequest對象 
var xmlhttp; 
if (window.XMLHttpRequest) { 
//IE7+, Firefox, Chrome, Opera, Safari 
xmlhttp = new XMLHttpRequest; 

//針對某些特定版本的mozillar浏覽器的bug進行修正 
if (xmlhttp.overrideMimeType) { 
xmlhttp.overrideMimeType('text/xml'); 
}; 
} else if (window.ActiveXObject){ 
//IE6, IE5 
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); 
}; 

if(xmlhttp.upload){ 
//2.回調函數 
//onreadystatechange是每次 readyState 屬性改變的時候調用的事件句柄函數 
xmlhttp.onreadystatechange = function(e){ 
if(xmlhttp.readyState==4){ 
if(xmlhttp.status==200){ 
var json = eval('(' + xmlhttp.responseText + ')'); 
//處理回調 
} 
} 
}; 

//3.設置連接信息 
//初始化HTTP請求參數，但是並不發送請求。 
//第一個參數連接方式，第二是url地址,第三個true是異步連接，默認是異步 
//使用post方式發送數據 
xmlhttp.open("POST","/run.php",true); 

//4.發送數據，開始和服務器進行交互 
//發送 HTTP 請求，使用傳遞給 open() 方法的參數，以及傳遞給該方法的可選請求中如果true, send這句話會立即執行 
//如果是false（同步），send會在服務器數據回來才執行 
//get方法在send中不需要內容 
var formdata = new FormData(); 
formdata.append("s", last_step); 
xmlhttp.send(formdata); 
}

$('btn').bind({
'touchstart':function(){
}
});
document.getElementById("btn").ontouchstart = function(){
};