Please add the author’s wechat official account. If there are new articles in the future, I will push them to you directly. Thank you very much.

0. Note

If part of the article cannot be displayed, please go to peng Li’s other blogs.

  • Jane’s book
  • CSDN

1. Introduction

There are more than 20 front end tests. Are you sure you don’t want to check them out?

Well, if you’re reading this, you’re clearly clicking in.

So congratulations, and I’m going to share with you some interview questions that I’ve collected recently from various companies.

This article is the author’s original, please inform the author and obtain permission to reprint.

The author reserves the right of legal action.

2. The body

Let’s cut the gossip and start sharing.

2.1 The first set of interview questions

! [](https://p1-jj.byteimg.com/tos-cn-i-t2oaga2asx/gold-user-assets/2017/3/12/ca292505b76428e4b1277c1204f3f0cd~tplv-t2oaga 2asx-image.image)

  • What is the output of the current piece of code?
  • What is the output of the current piece of code?
  • Suppose I have an article,var content = "... A lot of text.".

The article touched some sensitive words, how to find these sensitive words in the article, and set the background to red or change the font color and mark.

  • $fn.extend function in JQuery

  • Design an event binding mechanism based on the observer pattern

2.2 The second set of interview questions

! [](https://p1-jj.byteimg.com/tos-cn-i-t2oaga2asx/gold-user-assets/2017/3/12/017354178a4eb0050595669b12fcab2d~tplv-t2oaga 2asx-image.image)

  • List the values of display and explain what they do

  • The difference between “relative” and “absolute” in position includes the precautions and the origin of the position

  • What are the CSS selectors? Which attributes can be inherited? How is the priority algorithm calculated? What are the new pseudo classes in CSS 3?

  • What’s new in CSS 3?

  • What exactly does the new operator do?

  • What are the output lines A, B and C?

  • What are the outputs?
  • Why is the output?

2.3 Set of interview questions

! [](https://p1-jj.byteimg.com/tos-cn-i-t2oaga2asx/gold-user-assets/2017/3/12/a43a9a8504eda9f6057495df586a6f7a~tplv-t2oaga 2asx-image.image)

  • Find duplicate elements in the array using as many methods as possible

  • For example: [1,2,4,4,3,3,1,5,3]

  • Output: [1,3,4]

  • The authors add: if multiple methods are given, please give their respective complexity

  • Given some documents (docs), words (words), find all documents in which the word is present

2.4 Set of interview questions

! [](https://p1-jj.byteimg.com/tos-cn-i-t2oaga2asx/gold-user-assets/2017/3/12/a05e278eaed4f92cfeea8f117dbf68fc~tplv-t2oaga 2asx-image.image)

  • The local server is 172.16.2.30:8080 /test/index.html

The server address is 172.16.3.30:8088 /get/data. The request mode is get. Data is “”

{“success” : true, “message” : “request success”, “data” :” li Ping QQ: 3206064928″, “code” : 200};

Please write a JS program to get the data on the server address

PS:

If you need JS libraries or plugins, use reqiure.js

2.5 Set of interview questions

! [](https://p1-jj.byteimg.com/tos-cn-i-t2oaga2asx/gold-user-assets/2017/3/12/053d12cafbf437728a57920aa80062eb~tplv-t2oaga 2asx-image.image)

  • Use an algorithm to take N numbers from A given unordered, non-repeating array A and add them up to M.

The time/space complexity of the algorithm is given.

2.6 Set of interview questions

! [](https://p1-jj.byteimg.com/tos-cn-i-t2oaga2asx/gold-user-assets/2017/3/12/d428c7d30c913dd12a096d9e7a731efb~tplv-t2oaga 2asx-image.image)

  • Please write down the order of the hyperlinks or how you link them in the initial style.

  • No underscore is required by default, and there is an underscore over the mouse

  • How to fix the double margin BUG in IE 6 when float and margin are used together?

  • Why can’t you define a container around 1px high?

  • How to solve the problem of centering tabs in FireFox?

  • Please write how XHTML and CSS annotation?

  • Please abbreviate the 1px straight gray rectangle with no border.

2.7 The seventh set of interview questions

! [](https://p1-jj.byteimg.com/tos-cn-i-t2oaga2asx/gold-user-assets/2017/3/12/cccda0d7cf1494471c15cfd3561f4bc4~tplv-t2oaga 2asx-image.image)

  • What does the following code output?
  • Define a log method that can proxy the console.log method.

  • Describe Sass and Less briefly and explain the differences.

  • Without looping, create an array of length 100 with each element’s value equal to its subscript.

  • When a module of the project has a problem, how do you locate the error? What is your favorite testing tool?

  • How to embed audio in HTML5?

  • What are the HTML5 storage types and what are the differences?

  • What are the new pseudo classes in CSS 3?

  • IOS automatically identifies a number as a mobile phone number. As a result, some Settings cannot be accessed. How can I solve this problem?

2.8 The eighth set of interview questions

! [](https://p1-jj.byteimg.com/tos-cn-i-t2oaga2asx/gold-user-assets/2017/3/12/7775156651665d30c4970c3cd580fef9~tplv-t2oaga 2asx-image.image)

  • The difference between HTML and XHTML?

  • What are the inline elements? What are block-level elements?

  • The box model of CSS

  • Write a few properties in CSS 3

  • What new tags were added to HTML 5 and what tags were removed?

  • What kinds of positioning are there?

  • Write a piece of code to implement TAB switching.

  • The authors add: Please do it in no less than three ways

  • When you click on an element in a page, alert displays the element’s tag name

  • Compatibility Issues

  • An integer whose digits are symmetrical is symmetric. Find all symmetries between 1 and 10,000.

2.9 The ninth set of interview questions

! [](https://p1-jj.byteimg.com/tos-cn-i-t2oaga2asx/gold-user-assets/2017/3/12/c6ca1081a443304cae1246d005322406~tplv-t2oaga 2asx-image.image)

  • What is the difference between a compiled language and an interpreted execution language (scripting language)?

  • Please give examples of two programming languages

  • List at least five application-layer network protocols.

  • Explain what UNIX timestamps mean and what they do, and write the code to get the current UNIX timestamps.

  • What does a version control tool do? List the version control tools you are familiar with.

  • What are the differences between HTTP GET/POST methods and the applicable scenarios?

  • The authors add: What about HTTPS? Do you know SSL? What are the connections between them?

2.10 Interview questions 10

! [](https://p1-jj.byteimg.com/tos-cn-i-t2oaga2asx/gold-user-assets/2017/3/12/841de10921c009c96689d0e387be390a~tplv-t2oaga 2asx-image.image)

  • Write down two compatibility issues encountered during development.

  • The author adds: How did you solve it?

  • Write methods for five Array objects

  • A brief introduction to front-end engineering

2.11 The eleventh set of interview questions

! [](https://p1-jj.byteimg.com/tos-cn-i-t2oaga2asx/gold-user-assets/2017/3/12/2f15990a8ce78f54a782d8e54da97154~tplv-t2oaga 2asx-image.image)

  • Typeof bar === “object” Check whether the bar type is object. What’s the problem? How to avoid it?

  • What is the output of the following code?

  • What is the output of the following code?
  • What is the output of the following code?

2.12 12th set of interview questions

! [](https://p1-jj.byteimg.com/tos-cn-i-t2oaga2asx/gold-user-assets/2017/3/12/aa62ee77b5d34714311843905a99bf1a~tplv-t2oaga 2asx-image.image)

  • How many data types are there in JS?

  • In JS, which are true and which are false?

  • Calculate the result of the following operation

// 3 var arr = [1,’abc’,function(){alert(3333);}]; alert(arr2); arr2;

// 4 var len = 4; while(len–){ setTimeout(function(){console.log(len)},3000); console.log(len); }

// 5 window.name = “Window”; var cat = { name:’Cat’ }; var dog = { name:’Dog’, sound:function(word){ alert(this.name + word); }}; dog.sound(“is pooping”); dog.sound.call(window,”is banking”); dog.sound.call(dog,”is banking”); T sound. The apply (cat, [‘ li ‘]);

// This article is the author of Li Peng original, do not reprint without permission, violators reserve the right to legal action // author QQ: 3206064928

  • Write down detailed rules for regular expressions

  • /^(0[1-9]\d\d?) ? [1-9]\d{6}\d? $/

  • /^(1[89]|[2-9]\d|100)$/i

  • / ^ [-] \ w + @ [a – z0-9 -] + ({[a-z] {2, 6}}, {1, 2} $/ I

  • Write the scramble array method

  • Write out the Li – > QQ: 3206064928. GetElementsByClassName implementation method

2.13 Set of interview questions 13

! [](https://p1-jj.byteimg.com/tos-cn-i-t2oaga2asx/gold-user-assets/2017/3/12/8cf4a7df62c4deebb8420dfd41940332~tplv-t2oaga 2asx-image.image)

  • Describe the difference between JSON and JSONP?

  • Source and target resources are in the same domain. Is JSONP done asynchronously in JQuery? Is it asynchronous across domains?

  • What front-end frameworks are you familiar with?

  • The authors add: no fewer than five

  • This section describes compatibility problems between IE and FF scripts

  • The authors add: no fewer than seven

  • Please write at least 5 new HTML 5 tags and explain their semantics and application scenarios.

  • What are the new form element types in HTML5?

  • The author adds: no less than 5 items, and describes the usage scenarios

  • What text effects are new in CSS 3?

  • The authors add: and explain the internal common attributes

  • How to implement outerHTML in FF?

  • Border-left-color, margin-left and -moz-viewport are rewritten to JS format

  • Li Pengzhi ridicule: my god, you have seen Marin-left? border-color-left?

2.14 Set of interview questions 14

! [](https://p1-jj.byteimg.com/tos-cn-i-t2oaga2asx/gold-user-assets/2017/3/12/46c3a4d2806efb0d5c5670ca80c95d9b~tplv-t2oaga 2asx-image.image)

  • Write code to output the result.
  • Write code to output the result.
  • Write code to output the result.

A collection of other interview questions

The computer is about to run out of power, hurry the rest of the hair together, save everyone to see the unhappy.

If you find it useful, please give the author a thumbs up and share, after all, there are still a lot of friends looking for jobs now.

Author name: Li Peng author QQ: 3206064928 author wechat: Lipeng_0524 This text: code words really hard, and see and cherish

! [](https://p1-jj.byteimg.com/tos-cn-i-t2oaga2asx/gold-user-assets/2017/3/12/718269f7857748d3603f7a61b523a567~tplv-t2oaga 2asx-image.image)
! [](https://p1-jj.byteimg.com/tos-cn-i-t2oaga2asx/gold-user-assets/2017/3/12/ded8c4727ac3f2f135968adbe6584653~tplv-t2oaga 2asx-image.image)
! [](https://p1-jj.byteimg.com/tos-cn-i-t2oaga2asx/gold-user-assets/2017/3/12/b5b01f831b08b362e1e3d050b55d815d~tplv-t2oaga 2asx-image.image)
! [](https://p1-jj.byteimg.com/tos-cn-i-t2oaga2asx/gold-user-assets/2017/3/12/6c612da9c6a2a5951d5476eb4bd5f812~tplv-t2oaga 2asx-image.image)
! [](https://p1-jj.byteimg.com/tos-cn-i-t2oaga2asx/gold-user-assets/2017/3/12/282cee13067526ded7d70d526e9dd79e~tplv-t2oaga 2asx-image.image)
! [](https://p1-jj.byteimg.com/tos-cn-i-t2oaga2asx/gold-user-assets/2017/3/12/fff079facc95c3882ef75f01e357101e~tplv-t2oaga 2asx-image.image)
! [](https://p1-jj.byteimg.com/tos-cn-i-t2oaga2asx/gold-user-assets/2017/3/12/77c9a088b80500de1cddca1a3a5ca387~tplv-t2oaga 2asx-image.image)

3. Afterword.


Oh, my God, it’s finally finished. It took three days to write this article.

She’s so tired.

But when it’s done, it’s a sense of accomplishment.

In fact, many people do not understand bloggers. Why do they write blogs? Why waste effort when you don’t have enough time? It may take you two or three days to write an article by yourself, but it only takes about ten minutes for others to steal an article.

In fact, I also thought about these problems, like the article written before, the reading volume of nearly 7W, others come and ask, can reprint? I say ok, turn head article to become others, and often crown what, “well-known XXX tells you, should XXXX” what of, the result does not have oneself what thing.

At that time, I suddenly felt that my efforts really had no effect.

After so many years of “copying”, many times you will find that your writing is not even as fast as others’ copying.

Hey, make fun of a wave of negative energy.

But to ridicule, the article is still to write, for no other reason, I just hope that those who know me and like to read my article, some time in the future, encounter a certain problem, can remember, alas? This is a question pongo has written about before. I’ll go and have a look.

In a word, I do not write articles for other, just do a share, this is a hobby, without any interest disputes.

Today’s postscript is probably the longest postscript ever, so one last word.

The past is not enough, the rest of my life is not forced.

I hope you can find a more suitable job in this job-hopping season.

Author: Li Peng QQ:3206064928 wechat: Lipeng_0524