In the Analects of Confucius, Zeng Zi said, “EVERY day I examine myself three times.” Front-end interview daily 3+1 questions, to interview questions to drive learning, progress a little every day! Let efforts become a habit, let struggle become a kind of enjoyment! Believe in the power of persistence!!


  • Study without closing, recharging and refueling only to meet a better myself, 365 days without holidays, every morning at 5 o ‘clock purely manual release of interview questions (to myself, happy everyone).
  • I hope you stay calm in this pompous front circle and spend 20 minutes a day studying and thinking.
  • In this ever-changing, class library emerging in endlessly front, we suggest that you do not wait to find a job, just brush the problem, advocate daily learning! (HTML, CSS, javascript are the cornerstone!)
  • Welcome everyone to exchange Issues, encourage PR, thank Star, you can add my wechat with good suggestions to discuss!

I hope you can study and think every day to achieve the purpose of coming here!! (Don’t come for anyone, come for yourself!)

Welcome to work with Jsliang to deal with the front end of the system. Currently, WE are working on LeetCode to get through both algorithms and data structures. Making the address

html

  • Please describe the difference between cookies, sessionStorage and localStorage?
  • What are inline elements, block-level elements, and void elements?
  • Describe your understanding of AccessKey and give an example of how it can be used.
  • HTML5 how to add voice input function for input box?
  • What are the application scenarios of HTML5 Page Visibility?
  • List the meta tags you use most often
  • What does Doctype do? Do you know how many Doctype document types there are?
  • Write the following HTML tags: font, center, bold, and subscript
  • What new apis does the HTML5 standard provide? Which ones have you used?
  • What are some design principles to follow when using HTML5?
  • Have you ever used SVG? Draw a circle in SVG
  • Please tell us what you know about isISO8859-2 character set
  • Describe the difference between href and SRC for elements.
  • Can you give an example of the difference between OL and UL labels? What are the situations in which they are used?
  • Which fires first when both the href and onclick attributes of a tag exist?
  • How to use HTML5 to get positioning? How to solve the inaccurate positioning?
  • An example of how to output HTML code as is and not be parsed by the browser?
  • Give examples of your understanding of HTML5 Ruby tags. What are the application scenarios?
  • What are the application scenarios of iframe?
  • What does the href=”javascript:void(0)” under the a tag do? What do you understand about javascript:void(0)?
  • What is the method of opening a link in a new window? So how to set the whole site link to open in a new window?
  • Have you tried shaking your phone in HTML5? Do you know how it works?
  • Have you used the HTML5 Device API? What are the application scenarios?
  • What are the shortcut attributes of HTML? What’s the use of giving examples?
  • How is the HTML5 application cache different from the browser cache?
  • Have you used the datalist tag in HTML5? Tell me what you think of it
  • What do you understand about the HTML5 img attributes srcset and sizes? What are the application scenarios?
  • How does HTML5 recognize the spoken content and read the specified content?
  • How do mobile Web pages automatically detect phone numbers?
  • What is the order in which the four pseudo-classes on the A tag are executed?
  • What does favicon.ico do? How to reference in the page? What are the commonly used sizes? Can I change the suffix?
  • What formats do video and Audio support?
  • How to implement HTML5 compatibility in IE8 and below?
  • What does HTML’s A tag attribute rel=’nofollow’ do?
  • How do I disable forms from remembering passwords to auto-fill?
  • Write an example of how to open an APP in HTML5 on mobile?
  • Give examples of wake up calls, emails, and text messages
  • HTML5 if you don’t write<! DOCTYPE html>Will the page still work?
  • Why only one space can be displayed when multiple Spaces are entered in HTML?
  • Write several blank entities provided by HTML (5 or more)
  • What are HTML character entities? How to write the copyright symbol code?
  • Have you used HTML5’s drag and drop API? Tell me what you think of it
  • Have you used HTML5 webSQL and IndexedDB? Say what you understand about them
  • What is the difference between SRC, href and link?
  • Have you ever used WebGL? Tell me what you think of it
  • What are the advantages of HTML5 over HTML4?
  • Do you know the Download attribute of HTML5?
  • What is progressive rendering?
  • What are the new form attributes added to HTML5?
  • Do you know anything about HTML5 geolocation? How to use it?
  • Have Web Workers ever been useful? What problems can it help us solve?
  • Why is the page refreshed when the From form is submitted? How to prevent refresh?
  • How does the Form upload a file? Do you understand how it works?
  • What are the pros and cons of Ajax versus Flash?
  • What is your understanding of target=”_blank”? What are the security issues? How to prevent?
  • What is your understanding of WEB standards and W3C?
  • How does HTML5 use audio and video?
  • How to embed Flash in a page? What are the methods? Write out
  • What is the difference between XML and HTML?
  • What are the properties used in the video TAB to preload the video?
  • How do I fix elements at the bottom of the page? What are some good practices?
  • What is the ISISO8859-2 character set?
  • How to do webSocket compatibility processing?
  • What are the new features of HTML5? What elements have been removed?
  • What is the difference between title and H1, B and strong, and I and em?
  • Tell me what you understand about cookies and sessions
  • Html5 which tags can optimize SEO?
  • What are the differences between HTML and XHTML?
  • Simulate the implementation of a Textarea with a div
  • What is the difference between Standards mode and Quirks mode?
  • What’s the difference between HTML and HTML5?
  • Explain your understanding of display priorities for HTML elements
  • What is the difference between DOM and BOM?
  • What problem is a captcha on a web page supposed to solve? Tell me what kinds of captcha you know
  • Tell me about you<meta>Understanding of labels
  • Tell me what you know about the Shadow DOM
  • Explain your understanding of GBK and UTF-8? And talk about the possible causes of garbled code on the page
  • Please tell me about<script>,<script async>and<script defer>The difference between
  • Tell me what you understand about the property data-
  • about<form>What do you know about the encType attribute of the tag?
  • Js in HTML<body>and<head>What’s the difference?
  • Talk about your understanding of the readonly and disabled attributes in the input element
  • Describe the display priority of HTML elements
  • Explain your understanding of replacement elements and non-replacement elements in HTML
  • How to create a circular clickable area on a page?
  • What do you think are the functions and advantages and disadvantages of table?
  • What is the difference between Alt and title of an element?
  • The difference between title and H1, B and strong, I and em?
  • Why does HTML5 only need to write<! DOCTYPE HTML>You can?
  • How to turn off autocomplete form in HTML5?
  • What are the common browser kernels? Introduce your understanding of the kernel
  • What is your understanding of semantic tags?
  • What are the common Settings of viewPort?
  • What are the ways in which multiple tabs within a browser communicate?
  • Explain how html5 offline storage works and how to use it.
  • What are the advantages and disadvantages of the IFrame framework?
  • What are the functions of label? And give corresponding examples to illustrate
  • This section describes the value and function of the hyperlink target attribute
  • How is offline storage of HTML5 files used and how does it work?
  • What are HTML global attributes (including H5)?
  • What are the elements of HTML (including H5)?
  • What is the difference between using link and @import when importing page styles?

css

  • Tell me what you understand about the box model of lower version IE
  • How do you plan responsive layouts?
  • What’s your understanding of the front end double plot? What are the advantages of using a 2x map over a 2x map on mobile?
  • How to make images of different sizes appear in a fixed size div with equal scale without distortion? Write out
  • Do you know anything about Retina resolution? Has it been used in practice?
  • What are the compatibility problems of wechat page on mobile terminal and what are the solutions?
  • How do I change the font color and size in placeholder?
  • Which has a higher priority: inline CSS or important?
  • When an element is set to float, what does its display value change to?
  • Why does it float? When do floats need to be cleared?
  • Write a div that is centered horizontally and vertically without fixed height.
  • Have you used media query for mobile layout? Let’s write an example
  • What is the difference between CSS pseudo-classes and pseudo-objects?
  • What happens when CSS’s overflow property defines the content of the overflow element content area?
  • There is an adaptive height div on the outer layer. There are two divs inside. One is fixed at 300px, and the other fills the remaining height.
  • Explain your understanding of CSS style overlay rules
  • Write a few styles that initialize CSS and explain why
  • What are the values of display? What are their roles respectively?
  • How do I make the body height adapt to the screen? Why is that?
  • Font style attributes include Italic and Oblique. What is the difference between the two?
  • IE(6/7/8/9/10/11/Edge)
  • List any bugs you have encountered in Internet Explorer 6/7/8/9 and how to resolve them
  • What is the basic statement structure of CSS?
  • Write an example to explain how to force (automatically) line breaks and no line breaks in English and Chinese
  • Describe your understanding of the BEM specification and give examples of common CSS specifications.
  • Overflow scroll is not smooth.
  • When does display:inline-block display a gap?
  • Use CSS to draw an arbitrary Angle of the sector, you can write a variety of implementation methods
  • Can you explain what floating is and how it works? What problems do simultaneous floats cause?
  • Say you are right! In which scenarios is it commonly used?
  • What browser compatibility issues have you encountered while actually writing CSS? How did it work out?
  • How to change the text color and background color of selected text?
  • What is your understanding of responsive design? You know how it works? What do you do to be compatible with lower versions of IE?
  • What grid systems have you used? What’s the difference?
  • Please tell me about*{box-sizing: border-box; }What are the effects and benefits of
  • Tell me your understanding of JPG, PNG, GIF, respectively in what scenarios to use? Have you ever used WebP?
  • How to eliminate the Transition screen?
  • Is the element’s vertical percentage set relative to the height of the container?
  • Draw a red heart with CSS
  • This section provides examples of how to express colors in the CSS
  • What are the common differences between absolute and fixed of position?
  • What is the minimum interval between writing animations manually, and why?
  • How do I center a div? How do I center a floating element? How do I center an absolutely positioned div?
  • Draw a sun with CSS
  • What CSS frameworks have you used? Talk about their characteristics
  • What are the most common attributes of box-sizing? What are the roles of the two?
  • What is the difference between inline, block, and inline-block?
  • What are the scenes used for margin and padding?
  • What is parallax rolling? How to achieve the effect of parallax scrolling?
  • What is the difference between :nth-child and :nth-of-type for CSS3?
  • How to use custom fonts? What should I pay attention to?
  • What if position is superimposed on display, overflow, and float?
  • Have you ever used Flex? Tell me briefly what you know about it
  • This section describes how to optimize and improve the CSS performance
  • If your design uses a non-standard font, how do you implement it?
  • Do you know how full screen scrolling works? What CSS properties does it use?
  • How did you detach the style module?
  • Tell me what you understand about media inquiries
  • How many contour layouts do you know? Write out
  • Handwriting a full screen character layout scheme
  • What is the cause of the invisible space between span and span? What’s the solution?
  • What does resetting (initializing) the CSS do?
  • How to capitalize an English word?
  • How to make the text not copy?
  • Write down the ways you know about horizontal and vertical centralization of CSS
  • Center single-line text and left-align multi-line text beyond displaying “…”
  • Draw a line 1px high without using the border. It will look the same in standard and weird mode in different browsers
  • Write the CSS prefix for the mainstream browser kernel private properties
  • Use Flex to achieve a three-column layout, fixed on both sides and adaptive in the middle
  • How does the browser determine if an element matches a CSS selector?
  • Draw a triangle with CSS
  • What’s the difference between the three assignment methods?
  • How do YOU make your fonts clear and thin with CSS?
  • Describe the format of the picture you know and how it will be used
  • What is the difference between rgba() and opacity?
  • How to modify chrome to remember passwords after automatically filling forms with yellow background?
  • Tell me what you understand about z-index
  • Should I use odd or even fonts on the page? Why is that?
  • Have you ever used a CSS preprocessor? Which one do you prefer? How does it work?
  • How are CSS priorities calculated?
  • How do browsers parse CSS selectors?
  • What is your understanding of line-height?
  • How to make Chrome support text smaller than 12px?
  • What does the CSS property content do? What scenarios are available?
  • What is FOUC? How did you avoid FOUC?
  • What are the advantages and disadvantages of CSS sprites?
  • Please describe margin overlay and its solution
  • What is the difference between the style tag before and after the body?
  • position:fixed; What if it doesn’t work on ios?
  • What is the difference between a single colon and a double colon in ::before and :after, and what do these pseudo-elements do?
  • Explain your understanding of the CSS box model
  • What are the common layout methods of the CSS?
  • What’s the difference between PX, EM and REM?
  • Briefly describe your understanding of elegant degradation and progressive enhancement
  • What are the advantages and disadvantages of clearing float?
  • Describe your understanding of the BFC specification
  • Create a triangle with CSS and describe how it works
  • CSS3 new pseudo class has what and brief description
  • What are the CSS selectors? Which attributes can be inherited?
  • What are some ways to hide elements on a page?
  • What are the new features of CSS3?
  • Grail layout and double wing layout understanding and difference, and code implementation

js

  • How do you handle Async/Await exceptions better?
  • Accurate to say'1, 2, 3, 4. The split ()What is the result (including type and value) of?
  • How to use JS to read PDF without relying on third-party libraries?
  • The four methods of addition, subtraction, multiplication and division are respectively encapsulated
  • How to read and export Excel with pure JS?
  • What is your understanding of the difference between synchronous and asynchronous?
  • Write an example to show how to bind events to LI (ul has 1000+ Li).
  • What are your best methods for implementing a JS continuous animation?
  • Write the intersection, union, difference and complement of the array respectively
  • What are some ways to write an infinite loop in JS?
  • What kinds of call forms do JS functions have?
  • Explain why} + [] === 0Is true?
  • What is the difference between null and undefined? In what situations are these two used?
  • Write a method that randomly scrambles an array
  • What are the schemes for asynchronous loading of JS?
  • Determine the result of instanceof and explain why [code]
    function test() {return test; 
    } 
    new test() instanceof test;
Copy the code
  • Write a sleep function
  • Place the Script tag at the bottom of the page</body>What’s the difference between before and after? How will the browser parse them?
  • What are the ways to lazily load JS?
  • Please describe your understanding of the same origin policy for browsers
  • How does JS implement inheritance?
  • With JS to achieve a multiplication table
  • How do I catch exceptions in JS? Can you write it down? In what situations should it be used?
  • What are decodeURI() and encodeURI() for example?
  • What are IIFEs? What’s it good for?
  • What are the iterative methods for arrays and objects?
  • Var x, y = 1; var x, y = 1; x + y = ?
  • Describe the implementation principles of Instanceof and Typeof and implement an Instanceof simulation yourself
  • What is the difference between js =, ==, ===? And explain their respective working process
  • Write a method that randomly generates a string of specified digits
  • Why is there a delay in mobile click events? What are the solutions?
  • Write a repeat function that repeats the string
  • What do you understand about light copy? And implement a deep copy of the array and object method
  • What’s the difference between get and POST in Ajax requests? In what scenarios are they used?
  • Tell me your understanding of Base64, what are its usage scenarios?
  • What is formData mainly used for? How does it operate?
  • Give an example of your understanding of JS implicit type conversions
  • Please explain what cookie isolation is. Why quarantine? How to isolate?
  • What do you understand about casts? What are the methods of type conversion?
  • How to make (a = = 1 & & & & a = = a = = 2 and 3) has a value of true, change “= =” to “= = =” after can also true?
  • Examples of javascript variable declaration enhancements and function declaration enhancements
  • Have you ever used HTML5 WebWork? What problems does it mainly solve?
  • Write a method to get the original width and height of an image
  • Implement a flattening deep function that flattens a multidimensional array
  • Write a method to format the amount
  • What do you understand about __proto__ and prototype
  • Write a method such that sum(x)(y) and sum(x,y) return the same result
  • How does JSONP work? Solve what problem?
  • Name four typical examples of using this
  • Write a function to find the maximum difference in a given array
  • What’s the difference between document load and Ready?
  • What is event delegation? What’s it good for? Can you write a simple example?
  • What are the ways to concatenate strings? Which is best? Why is that?
  • Write a function to find N factorial.
  • Write a countdown to the number of days left for Chinese New Year
  • Do you know anything about the cycle of events? Tell me!
  • What is your understanding of the event bubbling mechanism?
  • Write a method that swaps two integers (no temporary variables)
  • Describe how many ways you can create an object, and what are the differences?
  • What are the methods of deep cloning objects, and write down what you think is the best
  • Have you seen the JQuery source code? Can you briefly summarize how it works?
  • What’s the difference between a window object and a Document object?
  • Tell me what you understand about IIFE
  • Why is there a cross-domain problem? How to solve cross-domain?
  • Tell me what you understand about modularity
  • Tell me what you understand about Eval
  • Find the longest word in the string and return its length
  • Please hand write a slide effect
  • Please explain why 10. ToFixed (10) will give an error?
  • Please write a code about 520 romantic confession in Canvas
  • Say what you understand about this
  • What are the operations that cause memory leaks?
  • Write a method to transpose 0 and 1 (0 is 1, 1 is 0)
  • Write a method to determine whether a string is a palindrome string
  • Write a method to get the maximum and minimum value of an array
  • Explain what this code means!
  • Is it an array?
  • What is the difference between a call and a apply? And implement a bind method by hand
  • Write a method for determining the source of the device
  • How do I quickly get an array out of order and write it out
  • What are 0.1 + 0.2, 0.1 + 0.3, and 0.1 * 0.2 respectively? And explain why?
  • What is your understanding of the new operator? Implement a new method manually
  • Write a method to verify whether it is Chinese
  • Write a method to verify your ID number
  • What’s the difference between attribute and property?
  • You understand “use strict”; What is? What are the advantages and disadvantages of using it?
  • Typeof (‘ ABC ‘) and typeof ‘ABC’ are both strings, so is typeof an operator or a function?
  • What are the ways to get back to the top? Let’s get one of these out
  • Write a method to de-duplicate an array (supports multi-dimensional arrays)
  • What is a closure? What are the pros and cons?
  • Tell me about your understanding of javascript’s scope
  • Write a method that gets the parameters in the current URL query string
  • Briefly describe what built-in objects JS has
  • Describe briefly what a callback is and write an example
  • A method to write an encrypted string
  • Count the number of occurrences of one character or string in another string
  • Write a method that removes TAB and newline characters
  • Write a method that toggles the case of a string
  • Write a method to convert the underline name to the big camel name
  • Removes the last specified character from the string
  • Write a method to remove whitespace from a string
  • With recursive algorithm, array length is 5 and the random number of elements between 2 and 32 do not repeat the value

Soft skills

  • List a number of ways to reduce page load time
  • What is the difference between a process and a thread? What are the benefits of single threading of JS?
  • Have you bought your own server and domain name for your blog or website?
  • Have you ever drawn a flow chart? What graphs are used to represent start and decision respectively?
  • Have you ever used singleton patterns? What are the main application scenarios?
  • Can you write regex by hand without looking it up?
  • What do you think the level of front end engineer should be? Say what you think
  • Git branch, diff, merge
  • Do you know what is anti-theft picture chain? How to prevent theft chain? Tell me about your method
  • Describe your understanding of emojig. How does the front end handle emojis? What are its application scenarios?
  • What is DNS briefly? What does it do?
  • When does a browser appear to have a blocked pop-up window? How to solve it?
  • Does your team have rules? What specifications are defined for example?
  • Did you make any performance improvements before the project was ready to go live?
  • Tell me your understanding of robots file, what is its function?
  • Describe your understanding of the hosts file. What does it do?
  • What kind of books do you read? How do you read books?
  • What is the difference between “reset” and “revert”? What scenarios do they apply to?
  • Do you usually develop on MAC or Windows? Give at least three examples of the difference between the two?
  • What’s the difference between a refresh and a forced refresh? Tell me what you think of both
  • Do you grab HTTPS and mobile packages? Describe how to catch these two kinds of bags?
  • Tell me how you learn on your own? How do you arrange your time?
  • What do you think you lack in the position you are applying for?
  • Do you know what websocket is? What are its application scenarios?
  • A project that writes a lot of purely static pages, with public parts (such as headers and tails) how do you extract public parts?
  • Have you ever used JWT? Tell me what you think of it
  • Can you catch a bag? What packet capture tools have you used?
  • Do you know anything about web server software? What have you used? What are the advantages and disadvantages of each?
  • Tell me about the most satisfying project you have worked on. Why is that?
  • Tell us what you think about the Internet industry and trends in front-end technology
  • Tell me what you think RESTful is
  • Do you know how qr codes work? How to combine android and ios download address into a TWO-DIMENSIONAL code?
  • What is the biggest lesson you’ve learned from all these years of development?
  • How can a local Git connect to a remote repository?
  • Why do browsers have compatibility issues?
  • What is the difference between JS animation and CSS animation?
  • What do you think are your greatest strengths and weaknesses? Can you give me some examples?
  • What if the interviewer asks you to tell me about your family? What would you say?
  • At the end of the day, if the technical and HR people ask you: Do you have any questions? What would you ask separately?
  • What would you say if the interviewer asked you to introduce yourself first and then tell me about your work experience?
  • What are design patterns? What are some of the design patterns you use most often?
  • Tell me what you understand about isomorphism and SSR
  • Know what IPV6 is? What’s the difference between it and IPV4?
  • How to prevent hair loss?
  • What do you do when you’re asked to take on an old project that you feel sucks?
  • What do you think of the arrival of 5G? Say what you think
  • Tell me about your understanding of the browser’s critical render path
  • What is your understanding of domain convergence and divergence? In what scenarios are they used?
  • Website is hijacked how to implant advertising? How to prevent it?
  • What should you do when you disagree with your superior?
  • Have you ever used local storage? What are the restrictions? Have you considered what to do if you exceed the limit?
  • Tell me your understanding of CDN and have you met any problems in using it?
  • What tools do you use to write documents? Has Markdown ever worked?
  • Tell me what you understand about HTTP and HTTPS
  • Have you ever encountered font infringement? How to solve it?
  • The word 996 is very popular these days. Tell me your opinion about 996
  • What should you do if HR asks you to do a back-check and provide the bank statements of the last three months?
  • Tell us your opinion and suggestion about this project
  • From your perspective, how do you manage the front end team?
  • Describe your understanding of HTTP, HTTPS, http2
  • What are you studying recently? Can you tell me where you see yourself in the next three to five years?
  • What is your current role on the team and has it made a significant difference?
  • Do you have your own blog? Do you usually write some technical articles?
  • Tell us what you understand about NodeJs and what it is used for
  • What are public key encryption and private key encryption?
  • Do you know what the three Musketeers are? Have you used Dreamwear?
  • What do you do if you are asked to quickly use a new technology that you are not familiar with?
  • How much do you know about front-end security? Explain your understanding of XSS and CSRF
  • What front-end performance optimizations do you know?
  • Do you understand what technical debt is?
  • What is your understanding of full stack engineer?
  • What was your workflow like and how did you collaborate with others at your last company? How does it work across departments?
  • How do you work under pressure?
  • What is CRLF?
  • What happens when you type a URL into a browser and the page is displayed?
  • Why did you leave your last job?
  • What is your understanding of Git’s branch and workflow?
  • Tell me about a difficult technical problem you have encountered in your work. How is it solved?
  • Have you ever had a boss ask for COMPATIBILITY with IE? Internet explorer? What do you feel?
  • Tell me one or more things (other than your job) that you think would add value to your interview
  • How do you understand the position of front End engineer? Talk about its future?
  • Tell me about your understanding of redrawing and rearranging, and how to optimize?
  • Can you write native JS code by hand?
  • What’s in fashion these days? What websites do you visit regularly?
  • What do you think of league building? How do you usually carry out league building?
  • Tell me your understanding and difference between SVN and GIT
  • Does your company conduct code reviews? If so, how? If not, what do you think would be better?
  • How do you feel about working overtime?
  • What are your favorite editors to use? What’s the reason to like it?
  • What are the status codes of HTTP?

discussion

Welcome everyone to come to discuss, if you think it is helpful to your study, please click Star, and welcome to join the “front-end interview daily 3+1” wechat group (scan your wechat account to invite you to join the group) to communicate with each other.