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

view source

print?01 $('#layer')

02 document.getElementById('layer')

03

04 $('#layer span')

05 var layer = document.getElementById('layer');

06 var span = layer.getElementsByTagName('span');

07

08 $('#inner').parent()

09 document.getElementById("inner").parentNode

10

11 $(window).width();

12 document.body.clientWidth

13

14 $('#layer').width();

15 document.getElementById('layer').style.width

16

17 $('#wrap').append('<span>a</span>');

18 var span=document.createElement("span");

19 span.innerHTML='a';

20 document.getElementById("wrap").appendChild(span);

21

22 $('#wrap span').remove();

23 deleteSpan();

24 function deleteSpan(){

25 var content=document.getElementById("wrap");

26 var childs=content.getElementsByTagName("span");

27 if(childs.length > 0){

28 content.removeChild(childs[childs.length-1]);

29 deleteSpan();

30 }

31 }

32

33 $('#wrap').css({'left':'100px'});

34 var wrap = document.getElementById('wrap');

35 wrap.style.left = '100px';

36

37 $('#banner').hide();

38 document.getElementById('banner').style.display = 'none';

39

40 $('#banner').show();

41 document.getElementById('banner').style.display = 'block';

42

43 $('#people').addClass('people_run2');

44 document.getElementById("people").classList.add('people_run2');

45

46 $('#people').removeClass('people_run1');

47 document.getElementById("people").classList.remove('people_run1');

48

49 $('#number').text(1);

50 document.getElementById('number').innerHTML = 1;

view source

print?01 $.ajax({

02 type: "POST",

03 url: 'run.php',

04 data: 's='+last_step,

05 dataType:"JSON",

06 timeout: 2000,

07 success: function(data){

08 //處理回調(diào)

09 }

10 });

11

12 //1.創(chuàng)建XMLHTTPRequest對象

13 var xmlhttp;

14 if (window.XMLHttpRequest) {

15 //IE7+, Firefox, Chrome, Opera, Safari

16 xmlhttp = new XMLHttpRequest;

17

18 //針對某些特定版本的mozillar瀏覽器的bug進行修正

19 if (xmlhttp.overrideMimeType) {

20 xmlhttp.overrideMimeType('text/xml');

21 };

22 } else if (window.ActiveXObject){

23 //IE6, IE5

24 xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");

25 };

26

27 if(xmlhttp.upload){

28 //2.回調(diào)函數(shù)

29 //onreadystatechange是每次 readyState 屬性改變的時候調(diào)用的事件句柄函數(shù)

30 xmlhttp.onreadystatechange = function(e){

31 if(xmlhttp.readyState==4){

32 if(xmlhttp.status==200){

33 var json = eval('(' + xmlhttp.responseText + ')');

34 //處理回調(diào)

35 }

36 }

37 };

38

39 //3.設(shè)置連接信息

40 //初始化HTTP請求參數(shù)，但是并不發(fā)送請求。

41 //第一個參數(shù)連接方式，第二是url地址,第三個true是異步連接，默認(rèn)是異步

42 //使用post方式發(fā)送數(shù)據(jù)

43 xmlhttp.open("POST","/run.php",true);

44

45 //4.發(fā)送數(shù)據(jù)，開始和服務(wù)器進行交互

46 //發(fā)送 HTTP 請求，使用傳遞給 open() 方法的參數(shù)，以及傳遞給該方法的可選請求中如果true, send這句話會立即執(zhí)行

47 //如果是false（同步），send會在服務(wù)器數(shù)據(jù)回來才執(zhí)行

48 //get方法在send中不需要內(nèi)容

49 var formdata = new FormData();

50 formdata.append("s", last_step);

51 xmlhttp.send(formdata);

52 }

view source

print?1 $('btn').bind({

2 'touchstart':function(){

3 }

4 });

5 document.getElementById("btn").ontouchstart = function(){

6 };

更多信息請查看IT技術(shù)專欄