웹 전면 시험문제: 실습 직책

1. W3C 표준이란, HTML4.0, DHTML, HTML5의 차이점은 무엇입니까?
2. 상자 모형이 무엇인지, css의 상자 모형은 몇 가지가 있는지, 그들이 어떤 차이가 있는지 말해 보세요.

box-sizing:border-box;/*        */      border      
box-sizing:content-box;/*         */

3. css에 스타일을 도입하는 방법은 몇 가지가 있습니까?

link      
    style="width:100px"

    /*  */

4. css에서 각종 선택기의 우선순위를 말하고 비교

!important > #id  > .class > div 

div span em{}     div em{}

   style="width:100px"     #id 

(> div :nth-child  +  ~)

5.css3에 추가된 고급 속성
transform transition box-shadow border-radius display:flex @media only screen and (max-width:xxxx){
} animation perspective perspective-origin transform-origin text-overflow word-break:break-all word-wrap:break-word; outline:

background-image:-webkit-linear-gradient(left top,red,blue);
background-size:cover;

(
    -webkit-filter:  
    -webkit-text-stroke:    

)

                                             

6.html5에 추가된 태그와 사용하지 않는 태그
신규: input: 이메일 tel search color date month time range

   video
   audio
   head
   section
   sidebar
   article
   foot
   menu
   nav

  ：basefont
      big
      center
      font
      s
      strike
      tt
      u
      frame
      frameset
      noframes

7.javascript의 기본 데이터 유형은 무엇입니까?
배열 객체 숫자 유형 문자열 부울 값undefined null
8. 알 수 없는 높이의div를 페이지의 수평 수직으로 가운데로 배치하는 방법

8.1.  transform:translate       50%
    ~
               ，       top:50%,left:50%,
        transform:translate(-50%,-50%)
8.2      ，       0，  margin：auto
     50%,            0，  margin:auto;
        .box4 span{
          width: 50%; 
          height: 50%; 
          background: #eee;
          margin: auto; 
          position: absolute; 
          top: 0; left: 0; bottom: 0; right: 0; 
           word-break: break-all;
        }
 8.3      ，    top left   50%；margin-left/top:        ；

9. 자바스크립트 클립이란 무엇인가

    function a(){
        return function b(){
            return 'web';
        }
    }

    var name = a()();
    alert(name);

10.undefined와null은 어떤 차이가 있습니까

    undefined    
    null           

11.window.onload 및 $(document).ready () 의 차이점
한 페이지에 $(document)가 여러 개 있을 수 있습니다.ready () 방법은 여러 가지 방법으로 실행할 수 있습니다. 한 페이지에 window만 있습니다.onload = function () {} 여러 개의 window를 썼다면.onload = function () {} 그러면 뒤에 있는 것은 앞에 있는 것을 덮어씁니다!
12.css에서 부동을 제거하는 방법은 무엇입니까
CSS의 오버플로우 속성 사용하기;위조 요소를 사용하여 부동을 제거합니다.clearfix:after{ content:”“; width:0; line-height:0; display:block; visibility:hidden; clear:both; } .clearfix {zoom:1;/호환 i/} 이중 위조 요소를 사용합니다.clearfix:after,clearfix:before{ content:”“; display:table; clear:both; } .clearfix {zoom:1;/호환 ie/}
13. 문자열을 캡처하는 방법은 무엇입니까
인덱스 3의 위치부터 6개의 길이를 캡처합니다. 즉 인덱스가 9인 위치까지 캡처합니다. substr(3,6)/인덱스 3의 위치부터 캡처해서 인덱스가 6인 위치까지 캡처합니다.
14. 텍스트 상자에서 텍스트가 바뀔 때 발생하는 이벤트는 무엇입니까

oninput(html5    )
onchange

15.html 중 어떤 라벨이 단일 라벨입니까?(시작 및 끝 태그가 없고 하나의 태그만 있음)
hr,br,input,img meta link
16.ajax에서 get과post 요청은 어떻게 다릅니까?
1. 보안 측면에서 get은 데이터를 URL에 전송하고 GET 방식으로 요청한 데이터는 브라우저에 캐시되어 안전하지 않습니다. 2.전송 데이터 크기를 고려할 때 get의 바이트는 1024,post는 4kb로 제한한다
17. 데이터의 마지막 요소를 삭제하는 방법은 무엇입니까
shift 그룹 삭제 시작 unshift 그룹 추가 pop 그룹 끝 삭제 push 그룹 끝 추가
18. 밑에 있는 메뉴에서 사용자가 폼 요소select의 값을 변경할 때 어떤 이벤트를 터치합니까?
onchange
19. 그림의alt와title 속성은 어떤 차이가 있습니까
alt: 그림 경로를 찾을 수 없을 때 바꿀 텍스트 title: 마우스를 그림에 놓을 때 표시되는 텍스트, 전역 속성, 모든 탭을 추가할 수 있습니다
20. 하이퍼링크를 새 창에 열면 어떤 속성을 추가해야 합니까?
target=”_blank” target=”_self "display:block (헷갈리지 마세요)
21.javascript의 전역 대상은 어떤 것들이 있습니까
new Date//날짜 new Object//객체 new String//문자열 new Array//배열 new RegExp//정규 표현식
22. 키보드의 키 코드가 없는 키 코드
prt sc sysrq 스크린샷 키
23. 원소를 숨기면 어떤 css 속성이 가능합니까?
display:none visibility:hidden background-color:rgba(0,0,0,0) transparent z-index:-1; left:-200%;
24.display:none; 그리고visibility:hidden;무슨 차이가 있느냐
display:none 숨기기 보존하지 않음visibility:hidden 숨기기 보존 위치
25. 페이지가 엉망이 되었는데 어떻게 해결합니까?
26. 페이지의 마운트가 비교적 느리다. 당신은 어떤 방법으로 페이지의 체험을 원활하게 할 수 있습니까?
코드: 1.CSS 코드를 한 줄로 압축하고 주석을 줄입니다.index.js home.js reset.js public.js jquery.min.js는 여러 js를 합쳐서 압축해서 페이지에 도입합니다!3. js에서는 DOM 요소를 최소화합니다.4. 애니메이션 측면에서 css3로 실현할 수 있는 애니메이션은 js로 실현하지 않도록 한다.예를 들어 배경색 div:hover transition DOM에 중지합니다.onmouseover 5.코드를 간소화하라!되도록 끼워넣지 마세요.
jimmy

    

        
 
            jimmy
        
    

6.  ，         ，    ！
    var s = 123;
    var fdsgjlfgh =123;

그림 1.icon_home.png icon_qq.png30*30px 여러 개의 작은 그림을 사이다 그림으로 합치면 http 요청을 줄일 수 있습니다.그림이 뚜렷하다는 전제에서 그림이 작은 자원 공간을 차지하도록 하고 그림을 압축합니다!500*500px100*100px(페이지 전체 자원 크기가 비교적 크면 일반적으로 그림이 비교적 큰 공간을 차지한다. 따라서 그림을 압축하는 것은 더욱 작은 처리 방식이 필요하다).jimmy.jpg(12kb)jpg는 투명한 배경을 만들 수 없습니다.png(65kb)png 그림은 배경도를 설정하지 않은 투명한 상태에서 가능한 jpg 그림 형식을 사용할 수 있습니다. 4.png,jpg 대신 base64 그림을 사용하면 그림 자원 크기를 줄일 수 있습니다

5.          ，   。         ，          ！                  
(        ，             )

문서: 1.http 요청 수량을 줄이다.2. 서버에 배치된 URL은 fb를 너무 길게 하지 마세요.mylove920.com/jimmy/index.html fb.mylove920.com/jimmy/love/index.html
캐시 방면: 첫 번째 페이지에 들어가면 서버에서 파일을 읽어야 합니다.만약 브라우저의 캐시를 지우지 않았다면, 두 번째 들어갈 때 페이지는 서버에서 내용을 읽지 않고 캐시에서 읽습니다.(캐시에서 빨리 읽기!)
27. $.ajax({

    url:'',//     
    data:{},//    
    type:'',//    
    dataType:'json',//    
    success:function(){
        //       
    },
    error:function(){
        //    
    }
})

28.ajax는 크로스오버 요청을 어떻게 처리합니까?

 dataType    jsonp;

29.H5 터치 이벤트
터치start 손가락이 키보드를 만질 때 터치move를 터치하고 손가락이 화면에서 미끄러질 때 터치end를 연속으로 터치하고 손가락이 화면을 떠날 때 터치cancel을 터치하고 손가락이 화면을 터치할 때 핸드폰이 갑자기 배터리가 없어지거나 친구가 전화가 왔어요!이번 사건이 중단되었을 때 촉발!
30. 클릭 이벤트가 이동단에서 300ms 지연되면 어떻게 처리합니까?

 zepto tap     click  

31. 이동단 페이지에 반드시 써야 하는
창 내용 페이지 너비 = 장치의 너비 초기화 축소 비율 1.0,max(imum)는 사용자의 최대 축소 비율 1.0,min(imum)은 사용자의 최소 축소 비율 1.0을 허용하고 페이지의 축소 금지입니다