Front-end development school recruitment interview questions sorting [2] - HTML
Written in front:
All the interview questions have been sorted out and shared on GitHub. Welcome to star.
Address: https://github.com/shadowings-zy/front-end-school-recruitment-question
1. HTML element (element)
Q: Briefly introduce the commonly used HTML elements?
Block label: The element occupies a single line, and the width and height can be specified.
Commonly used block elements are:
<div>、<p>、<h1>-<h6>、<ol>、<ul>、<dl>、<table>、<form>
Inline element: The element is in one line, the width and height are determined by the content, and only when the content exceeds the width of the HTML, the line will be broken.
Commonly used inline elements are:
<a>、<span>、<i>、<em>、<strong>、<label>
An inline block element has the characteristics of an inline element and a block element at the same time. It is in a row with other elements, but the height, width, line height, and top and bottom margins of the element can be set. Commonly used inline block elements are:
<img>、<input>
Q: What is the semantic element?
Semantic elements are elements that themselves convey some information about their content type. These elements make the content of the page structured, clearer in structure, easy for SEO, easy to read and maintain.
Common semantic elements:
<header>
<footer>
<nav>
<article>
<section>
<aside>
<h1>
<h2>
<h3>
<h4>
<h5>
<h6>
<strong>
<em>
Q: What elements are added in HTML5?
| Label | illustrate |
|---|---|
<header> |
Defines the section or document header. |
<footer> |
Defines the section or document footer. |
<nav> |
Section that defines the navigation links. |
<article> |
Define the content of the article. |
<section> |
Defines a paragraph in a document. Such as chapters, headers, footers, or other parts of the document. |
<aside> |
Define content other than article. The content of aside should be related to the content of article. |
<audio> |
Define the sound. |
<canvas> |
Define the graph. |
<video> |
Defines a video, such as a movie clip or other video stream. |
<source> |
Defines media resources for media elements such as <video>and .<audio> |
2. HTML events
Q: Describe the event model of HTML? What does event capture/event bubbling mean?
When a page triggers an event, the browser mainly does three stages, namely:
1. Capture event stage
2. Target processing stage
3. Subsequent event processing stage
When an event is triggered, the process of passing the event object from the root node to the target node is event capture.
After the event is processed, the process of passing it backwards from the target node to the root node is event bubbling.
Q: How to prevent event bubbling? How to prevent element default behavior?
event.stopPropagation() // 阻止事件冒泡
event.preventDefault() // 阻止元素默认行为