Home > Article > Web Front-end > A summary of common AJAX interview questions
A summary of common AJAX interview questions
- coldplay.xixiforward
- 2020-07-31 11:54:262985browse
[Related topic recommendations: ajax interview questions (2020)]
1. Will you do it at work? Interact with the background? Then can you talk about a few parameters in the encapsulated ajax?
url: The address to send the request.
type: Request method (post or get ) defaults to get.
async: Synchronous asynchronous requests, default trueAll requests are asynchronous requests.
timeout: Timeout setting in milliseconds
data: The requirement is ## Parameters of type #Object or String, data sent to the server
cache : The default is true (when dataType is script, Default is false) , set to false will not be retrieved from the browser Load request information in cache.
dataType: The data type expected to be returned by the server.
The available types are as follows:
xml: Returns XMLDocument, can be processed with JQuery.
html: Returns plain text HTML information; contains script The tag will be executed when DOM is inserted.
#script: Returns the plain text JavaScript code. Results are not cached automatically.
json: Returns JSON data.
jsonp：JSONP format. When calling a function using the form JSONP, for example myurl?callback=?, JQueryWill automatically replace the last "?" with the correct function name to execute the callback function.
text: Returns a plain text string.
success: The callback function called after the request is successful, has two parameters.
(1) The data returned by the server and processed according to the dataType parameters.
(2) A string describing the status.
error: requires a parameter of type Function, a function that is called when the request fails. This function has 3 parameters
(1) XMLHttpRequestobject
(2) Error message
(3) Captured error object(Optional)
##complete :function(XMLHttpRequest,status){ //Final execution parameters after the request is completed
[Topic Recommendation]:2.json data If how to process his format you used to Is there a fixed format at work? If I send a request to delete a piece of data in the data, how do I know that the deletion is successful? Or where will it be displayed after deletion?
JSON.parse() Convert to a JSON object, parse it based on the data, and put it on the page.
Format: {} and [] combined with spliced JSONString
Send a request to delete data, the background will return the processing result, the frontend will judge whether it is successful based on the returned result, and then process the page elements.
3. Have you ever encountered this situation? In IE browser, the background image data has changed but the client has not changed. How to deal with it? He prompted that the browser's cacheJQuery.ajax() method, set cache to false, the request will not be loaded from the browser cache,
or use the post method to request data , will not be cached, and the data will be requested again every time
4. Implementation ideas of the tabMouse hover time, call method, pass inthis, partially hide the contents of all tabs, display this, and control display
5. The implementation idea of cascadeGenerally, regional data are stored using two-dimensional arrays, which are obtained from the background and stored later.According to the first options in a drop-down box, find the corresponding two-dimensional array data, loopnew Option() add into the drop-down box
6. Carousel chart Implementation ideasThe first one:
Name the pictures in order, and use the timer to change the path of the pictures every few seconds
Second type:
Use the seamless scrolling technology to put all the pictures into the page, and the timer will runscrollScroll, determine the scroll distance and take the remainder (%) The picture width is equal to 0, pause the timer , how many seconds before starting the timer.
7. Talk about what you understand about bootstrapBootstrap is developed based on HTML5 and CSS3, it is developed in Based on jQuery, we have made more personalized and humanized improvements. You only need to give the tag the corresponding Class name. Form a set of Bootstrap's own unique website style, and is compatible with most jQuery plug-ins.
8. The difference between angularjs and JQ
JQ Get it first and then use it.
Angularjs Use directly
9. The difference between JQmobile and JQ
jQuery Mobile 是创建移动 web 应用程序的框架。jQuery Mobile 适用于所有流行的智能手机和平板电脑。jQuery Mobile 使用 HTML5 和 CSS3 通过尽可能少的脚本对页面进行布局
(1) jQuery is a js library that mainly provides selectors, property modifications, event binding, etc.
(2) jQuery UI is based on jQuery, using jQuery Extensibility, designed plug-in. Provides some commonly used interface elements, such as dialog boxes, dragging behaviors, resizing behaviors, etc.
(3) jQuery itself focuses on the background and does not have a beautiful interface, while jQuery UI supplements the deficiencies of the former , it provides a gorgeous display interface, making it easier for people to accept. There is both a powerful backstage and a gorgeous frontstage. jQuery UI is a jQuery plug-in, but it specifically refers to the official maintenance of jQuery The UI direction plug-in.
10. Which libraries have you used in your work?
jQuery
11. (1) Bubble sort, 60-second countdown, (2) How to handle the json data returned by the background when the page loads more li
1.Double loop, starting from the first bit and judging the size of each subsequent bit, if the conditions are met, use the following principle to change the position
c = a;
a = b;
b = c;
2.Use JSON.parse() to obtain the corresponding JSON object, and add ## in a loop #li, put the data in.
12. Implementation idea of selecting allWhen clicking the select all check box, it is judged that checked is true or false, is it true prove that all are selected, Get all the corresponding check boxes below and change checked to true, otherwise change it to false.
13.有一个输入框，只允许输入数字或字母，如果输入不合法则将输入框的边框变为红色，写代码
var reg =/^[a-zA-Z0-9]+$/;
if(!reg.text(输入框取出的value)){
input.style.border= “red”;
};14.有一个数组a=[1,2,3]，如果数字a中包含1，则将数组内容复制一遍变为[1,2,3,1,2,3],写代码
for(var i = 0;i<a.length;i++){
if(a[i] ==1){
a.concat(a);
break;
}
}15.写一个函数，用于生产随机密码，传入的参数为密码的长度，返回生产的随机密码，要求生成的随机密码必须含有大写字母、小写字母和数字var padArr = ["a","b","c","d","e","f","g","h","i","j","k","l","m","n","o","p","q","r","s","t","u","v","w","x","y","z","A","B","C","D","E","F","G","H","I","J","K","L","M","N","O","P","Q","R","S","T","U","V","W","X","Y","Z","0","1","2","3","4","5","6","7","8","9"];var padStr = "";function asd(length){
for(var i = 0 ; i3a240317e75d0ba58009f06f969d5174.<span style="color:#0000FF;background:#FFFFFF;">Update data without refreshing. </span><span style="color:#333333;"><br></span><span style="color:#FF0000;background:#FFFFFF;">AJAX</span><span style="color:#FF0000;background:#FFFFFF;">The biggest advantage is that it can communicate with the server to maintain data without refreshing the entire page. This makes the </span><span style="color:#FF0000;background:#FFFFFF;">Web</span><span style="color:#FF0000;background:#FFFFFF;"> application respond more quickly to user interactions and avoids sending unchanged information over the network, reducing user waiting time and bringing a very good user experience. . </span><span style="color:#FF0000;"><br></span><span style="color:#0000FF;background:#FFFFFF;">2cc198a1d5eb0d3eb508d858c9f5cbdb.</span><span style="color:#0000FF;background:#FFFFFF;">Communicate with the server asynchronously. </span><span style="color:#333333;"><br></span><span style="color:#FF0000;background:#FFFFFF;">AJAX</span><span style="color:#FF0000;background:#FFFFFF;">Using asynchronous communication with the server, there is no need to interrupt the user's operation, and it has a faster response capability. Optimized the communication between </span><span style="color:#FF0000;background:#FFFFFF;">Browser</span><span style="color:#FF0000;background:#FFFFFF;"> and </span><span style="color:#FF0000;background:#FFFFFF;">Server</span><span style="color:#FF0000;background:#FFFFFF;">, reducing unnecessary data transmission, time and data traffic on the network. </span><span style="color:#333333;"><br></span><span style="color:#0000FF;background:#FFFFFF;">5bdf4c78156c7953567bb5a0aef2fc53.</span><span style="color:#0000FF;background:#FFFFFF;"> Front-end and back-end load balancing. </span><span style="color:#333333;"><br></span><span style="color:#FF0000;background:#FFFFFF;">AJAX</span><span style="color:#FF0000;background:#FFFFFF;">You can transfer some of the work previously burdened by the server to the client, and use the idle capabilities of the client to process it, reducing the burden on the server and bandwidth. , saving space and broadband rental costs. And to reduce the burden on the server, the principle of </span><span style="color:#FF0000;background:#FFFFFF;">AJAX</span><span style="color:#FF0000;background:#FFFFFF;"> is</span><span style="color:#FF0000;background:#FFFFFF;">“</span><span style="color:#FF0000;background:#FFFFFF;">Get data on demand</span><span style="color:#FF0000;background:#FFFFFF;">”</span><span style="color:#FF0000;background:#FFFFFF;">, which can minimize the burden caused by redundant requests and responses on the server and improve site performance. </span><span style="color:#FF0000;"><br></span><span style="color:#0000FF;background:#FFFFFF;">23889872c2e8594e0f446a471a78ec4c.</span><span style="color:#0000FF;background:#FFFFFF;">Widely supported based on standards. </span><span style="color:#333333;"><br></span><span style="color:#FF0000;background:#FFFFFF;">AJAX</span><span style="color:#FF0000;background:#FFFFFF;">Based on standardized and widely supported technology, there is no need to download browser plug-ins or applets, but customer permission is required</span><span style="color:#FF0000;background:#FFFFFF;">JavaScript</span><span style="color:#FF0000;background:#FFFFFF;">Executed on the browser. As </span><span style="color:#FF0000;background:#FFFFFF;">Ajax</span><span style="color:#FF0000;background:#FFFFFF;"> matures, some libraries that simplify the use of </span><span style="color:#FF0000;background:#FFFFFF;">Ajax</span><span style="color:#FF0000;background:#FFFFFF;"> have also come out. Similarly, another technology has emerged to assist programming, providing alternative functionality for users who do not support </span><span style="color:#FF0000;background:#FFFFFF;">JavaScript</span><span style="color:#FF0000;background:#FFFFFF;">. </span><span style="color:#333333;"><br></span><span style="color:#0000FF;background:#FFFFFF;">43ad812d3a971134e40facaca816c822.</span><span style="color:#0000FF;background:#FFFFFF;">The interface is separated from the application. </span><span style="color:#333333;"><br></span><span style="color:#FF0000;background:#FFFFFF;">Ajax</span><span style="color:#FF0000;background:#FFFFFF;"> Separates the interface and application in </span><span style="color:#FF0000;background:#FFFFFF;">WEB</span><span style="color:#FF0000;background:#FFFFFF;"> (it can also be said that data and presentation Separation) is conducive to division of labor and cooperation, reducing </span><span style="color:#FF0000;background:#FFFFFF;">WEB</span><span style="color:#FF0000;background:#FFFFFF;"> application errors caused by non-technical personnel's modification of pages, improving efficiency, and is more suitable for the current publishing system. </span><p><strong><span style="color:#C00000;background:#FFFFFF;">shortcoming:</span></strong></p><p><span style="color:#0000FF;background:#FFFFFF;">f35d6e602fd7d0f0edfa6f7d103c1b57.AJAX</span><span style="color:#0000FF;background:#FFFFFF;"> kills the </span><span style="color:#0000FF;background:#FFFFFF;">Back</span><span style="color:#0000FF;background:#FFFFFF;"> and </span><span style="color:#0000FF;background:#FFFFFF;">History</span><span style="color:#0000FF;background:#FFFFFF;"> functions, that is Breakage of browser mechanisms. </span><span style="color:#333333;"><br></span><span style="color:#FF0000;background:#FFFFFF;">In the case of dynamically updated pages, users cannot return to the previous page state because the browser can only remember static pages in the history. The difference between a page that has been fully read and a page that has been dynamically modified is very subtle; users will often expect that clicking the back button will cancel their previous operation, but in </span><span style="color:#FF0000;background:#FFFFFF;">Ajax</span><span style="color:#FF0000;background:#FFFFFF;"> Application, this will not be possible. </span><span style="color:#FF0000;"><br></span><span style="color:#FF0000;background:#FFFFFF;">The back button is an important feature of a standard </span><span style="color:#FF0000;background:#FFFFFF;">web</span><span style="color:#FF0000;background:#FFFFFF;"> site, but it cannot be compared with </span><span style="color:#FF0000;background:#FFFFFF;"> js</span><span style="color:#FF0000;background:#FFFFFF;"> Great cooperation. This is a serious problem caused by </span><span style="color:#FF0000;background:#FFFFFF;">Ajax</span><span style="color:#FF0000;background:#FFFFFF;">, because users often hope to cancel the previous operation by going back. So is there any solution to this problem? The answer is yes, those who have used </span><span style="color:#FF0000;background:#FFFFFF;">Gmail</span><span style="color:#FF0000;background:#FFFFFF;"> know that </span><span style="color:#FF0000;background:#FFFFFF;">Gmail</span><span style="color:#FF0000;background:#FFFFFF;"> is used below </span><span style="color:#FF0000;background:#FFFFFF;">Ajax</span><span style="color:#FF0000;background:#FFFFFF;">Technology has solved this problem. You can go back under </span><span style="color:#FF0000;background:#FFFFFF;">Gmail</span><span style="color:#FF0000;background:#FFFFFF;">, but it cannot change the mechanism of </span><span style="color:#FF0000;background:#FFFFFF;">Ajax</span><span style="color:#FF0000;background:#FFFFFF;"> , it is just a relatively stupid but effective method, that is, when the user clicks the back button to access the history, he creates or uses a hidden </span><span style="color:#FF0000;background:#FFFFFF;">IFRAME</span><span style="color:#FF0000;background:#FFFFFF;"> to reproduce the content on the page. change. (For example, when the user clicks back in </span><span style="color:#FF0000;background:#FFFFFF;">Google Maps</span><span style="color:#FF0000;background:#FFFFFF;">, it searches in a hidden </span><span style="color:#FF0000;background:#FFFFFF;">IFRAME</span><span style="color:#FF0000;background:#FFFFFF;"> and then The search results are reflected onto the </span><span style="color:#FF0000;background:#FFFFFF;">Ajax</span><span style="color:#FF0000;background:#FFFFFF;"> element to restore the application state to its then-current state.) </span><span style="color:#FF0000;"><br></span><span style="color:#FF0000;background:#FFFFFF;"> However, although It is said that this problem can be solved, but the development cost it brings is very high, and is contrary to the rapid development required by the </span><span style="color:#FF0000;background:#FFFFFF;">Ajax</span><span style="color:#FF0000;background:#FFFFFF;"> framework. This is a very serious problem caused by </span><span style="color:#FF0000;background:#FFFFFF;">Ajax</span><span style="color:#FF0000;background:#FFFFFF;">. </span><span style="color:#FF0000;"><br></span><span style="color:#FF0000;background:#FFFFFF;">#A related point is that using dynamic page updates makes it difficult for users to save a specific state to favorites. Solutions to this problem have emerged, most using the </span><span style="color:#FF0000;background:#FFFFFF;">URL</span><span style="color:#FF0000;background:#FFFFFF;"> fragment identifier (often called an anchor, i.e. </span><span style="color:#FF0000;background:#FFFFFF;">URL</span><span style="color:#FF0000;background:#FFFFFF;">The part after </span><span style="color:#FF0000;background:#FFFFFF;"></span><span style="color:#FF0000;background:#FFFFFF;">##) to keep track and allow the user to return to a specified application state. (Many browsers allow </span><span style="color:#FF0000;background:#FFFFFF;">JavaScript</span><span style="color:#FF0000;background:#FFFFFF;"> to dynamically update anchors, which allows </span><span style="color:#FF0000;background:#FFFFFF;">Ajax</span><span style="color:#FF0000;background:#FFFFFF;"> applications to update anchors simultaneously with the displayed content. .) These solutions also resolve many of the arguments surrounding back button support. </span><span style="color:#FF0000;"><br></span><span style="color:#0000FF;background:#FFFFFF;">2cc198a1d5eb0d3eb508d858c9f5cbdb.AJAX</span><span style="color:#0000FF;background:#FFFFFF;"> security issues. </span><span style="color:#333333;"><br></span><span style="color:#FF0000;background:#FFFFFF;">AJAX</span><span style="color:#FF0000;background:#FFFFFF;"> Technology not only brings a good user experience to users, but also benefits </span><span style="color:#FF0000;background:#FFFFFF;">IT</span><span style="color:#FF0000;background:#FFFFFF;"> enterprises Bringing new security threats, </span><span style="color:#FF0000;background:#FFFFFF;">Ajax</span><span style="color:#FF0000;background:#FFFFFF;"> technology is like establishing a direct channel to enterprise data. This allows developers to inadvertently expose more data and server logic than before. The logic of </span><span style="color:#FF0000;background:#FFFFFF;">Ajax</span><span style="color:#FF0000;background:#FFFFFF;"> can be hidden from client-side security scanning technology, allowing hackers to create new attacks from remote servers. And </span><span style="color:#FF0000;background:#FFFFFF;">Ajax</span><span style="color:#FF0000;background:#FFFFFF;"> is also difficult to avoid some known security weaknesses, such as cross-site scripting attacks, </span><span style="color:#FF0000;background:#FFFFFF;">SQL</span><span style="color:#FF0000;background:#FFFFFF;"> injection attacks and ##-based Security vulnerabilities of </span>#Credentials<span style="color:#FF0000;background:#FFFFFF;"></span> and so on. <span style="color:#FF0000;background:#FFFFFF;"></span><span style="color:#FF0000;"><br></span>5bdf4c78156c7953567bb5a0aef2fc53.<span style="color:#0000FF;background:#FFFFFF;"></span>Weak support for search engines. <span style="color:#0000FF;background:#FFFFFF;"></span><span style="color:#333333;"><br></span>The support for search engines is relatively weak. If used improperly, <span style="color:#FF0000;background:#FFFFFF;"></span>AJAX<span style="color:#FF0000;background:#FFFFFF;"></span> will increase network data traffic, thereby reducing the performance of the entire system. <span style="color:#FF0000;background:#FFFFFF;"></span><span style="color:#FF0000;"><br></span>23889872c2e8594e0f446a471a78ec4c.<span style="color:#0000FF;background:#FFFFFF;"></span>Destroy the exception handling mechanism of the program. <span style="color:#0000FF;background:#FFFFFF;"></span><span style="color:#333333;"><br></span>At least for now, like <span style="color:#FF0000;background:#FFFFFF;"></span>Ajax.dll<span style="color:#FF0000;background:#FFFFFF;"></span>, <span style="color:#FF0000;background:#FFFFFF;"></span>Ajaxpro.dll<span style="color:#FF0000;background:#FFFFFF;"> </span>These<span style="color:#FF0000;background:#FFFFFF;"></span>Ajax<span style="color:#FF0000;background:#FFFFFF;"></span> frameworks will destroy the exception mechanism of the program. Regarding this problem, I have encountered it during the development process, but after checking, there is almost no relevant introduction on the Internet. Later, I did an experiment and used <span style="color:#FF0000;background:#FFFFFF;"></span>Ajax<span style="color:#FF0000;background:#FFFFFF;"></span> and the traditional <span style="color:#FF0000;background:#FFFFFF;"></span>form<span style="color:#FF0000;background:#FFFFFF;"></span> submission mode to delete a piece of data<span style="color:#FF0000;background:#FFFFFF;"></span> ……<span style="color:#FF0000;background:#FFFFFF;"></span> brings great difficulties to our debugging. <span style="color:#FF0000;background:#FFFFFF;"></span><span style="color:#333333;"><br>##43ad812d3a971134e40facaca816c822.</span><span style="color:#0000FF;background:#FFFFFF;">Violates the original intention of </span><span style="color:#0000FF;background:#FFFFFF;">URL</span><span style="color:#0000FF;background:#FFFFFF;"> and resource positioning. </span><span style="color:#0000FF;background:#FFFFFF;"></span><span style="color:#333333;"><br>For example, if I give you a </span><span style="color:#FF0000;background:#FFFFFF;">URL</span><span style="color:#FF0000;background:#FFFFFF;"> address, if </span><span style="color:#FF0000;background:#FFFFFF;">Ajax</span># is used ##Technology, maybe what you see under this <span style="color:#FF0000;background:#FFFFFF;"></span>URL<span style="color:#FF0000;background:#FFFFFF;"></span> address is the same as what I see under this <span style="color:#FF0000;background:#FFFFFF;"></span>URL<span style="color:#FF0000;background:#FFFFFF;"></span> address. different. This is contrary to the original intention of resource positioning. <span style="color:#FF0000;background:#FFFFFF;"></span><span style="color:#FF0000;background:#FFFFFF;"></span><span style="color:#333333;">efbfa0de8737dc86eae413541a49df20.AJAX<br></span> does not support mobile devices well. <span style="color:#0000FF;background:#FFFFFF;"></span><span style="color:#0000FF;background:#FFFFFF;"></span><span style="color:#FF0000;background:#FFFFFF;">Some handheld devices (such as mobile phones, </span><span style="color:#FF0000;background:#FFFFFF;">PDA</span><span style="color:#FF0000;background:#FFFFFF;">, etc.) currently cannot support </span><span style="color:#FF0000;background:#FFFFFF;">Ajax</span><span style="color:#FF0000;background:#FFFFFF;">, such as When we open a website using </span><span style="color:#FF0000;background:#FFFFFF;">Ajax</span><span style="color:#FF0000;background:#FFFFFF;"> technology on a mobile browser, it is currently not supported. </span><span style="color:#FF0000;"><br></span>##40107655ec554331c1c6222ab67a141c.<span style="color:#0000FF;background:#FFFFFF;"></span>The client is too fat, and too much client code causes development costs. <span style="color:#0000FF;background:#FFFFFF;"></span><span style="color:#333333;"><br></span>Complex writing and error-prone<span style="color:#FF0000;background:#FFFFFF;"></span>; there are many redundant codes (layers contain <span style="color:#FF0000;background:#FFFFFF;"></span>js<span style="color:#FF0000;background:#FFFFFF;"></span> files It is a common problem of <span style="color:#FF0000;background:#FFFFFF;"></span>AJAX<span style="color:#FF0000;background:#FFFFFF;"></span>, plus a lot of server-side code in the past is now placed on the client); it destroys the original purpose of <span style="color:#FF0000;background:#FFFFFF;"></span>Web<span style="color:#FF0000;background:#FFFFFF;"></span> There are standards. <span style="color:#FF0000;background:#FFFFFF;"></span> <span style="background-color: rgb(255, 255, 255); color: rgb(255, 0, 0);"></span></p>21. How much do you know about cross-domain requests? <p></p><p>The same-origin policy stipulates that if the domain name, protocol, and port are inconsistent with the place where the request is initiated, it is a cross-domain request. <span style="color:#FF0000;"></span></p><p>This kind of Sometimes, you need to use some cross-domain request technology, <span style="color:#FF0000;"></span></p><p>1:<span style="color:#FF0000;"></span></p><p> <span style="color:#FF0000;"></span><span style="color:#FF0000;">## JQuery</span><span style="color:#FF0000;"> method, accessed using </span><span style="color:#FF0000;">JSONP</span><span style="color:#FF0000;"> mode, </span><span style="color:#FF0000;">dataType</span><span style="color:#FF0000;">: '</span><span style="color:#FF0000;">jsonp</span><span style="color:#FF0000;">' and then </span><span style="color:#FF0000;">url</span><span style="color:#FF0000;"> and then pass in </span><span style="color:#FF0000;">callback=?</span><span style="color:#FF0000;"></span></p># A random callback function name will be generated, or you can name it yourself. <p><span style="color:#FF0000;"></span><span style="color:#FF0000;">The background will get the value of </span></p>callback<p><span style="color:#FF0000;">, connect it to </span><span style="color:#FF0000;">() </span><span style="color:#FF0000;"> and put the data Enter </span><span style="color:#FF0000;">() </span><span style="color:#FF0000;"> and return to the page. </span><span style="color:#FF0000;"></span><span style="color:#FF0000;"> is equivalent to calling the function </span></p>function<p><span style="color:#FF0000;"> name </span><span style="color:#FF0000;">(data)</span><span style="color:#FF0000;">. </span><span style="color:#FF0000;"></span><span style="color:#FF0000;">Two:</span></p><p><span style="color:#FF0000;"> </span></p>Use<p><span style="color:#FF0000;">js</span><span style="color:#FF0000;background:#F9F9F9;">Tag loading method</span><span style="color:#FF0000;background:#F9F9F9;"></span><span style="color:#FF0000;background:#F9F9F9;"> </span></p>Use the <p><span style="color:#FF0000;background:#F9F9F9;">script</span><span style="color:#FF0000;background:#F9F9F9;"> tag</span><span style="color:#FF0000;background:#F9F9F9;"> src</span><span style="color:#FF0000;background:#F9F9F9;"> to write the request </span><span style="color:#FF0000;background:#F9F9F9;">URL</span><span style="color:#FF0000;background:#F9F9F9;">, connect the parameters after the address? </span><span style="color:#FF0000;background:#F9F9F9;">callback= </span><span style="color:#FF0000;background:#F9F9F9;">Function name</span><span style="color:#FF0000;background:#F9F9F9;"></span><span style="color:#FF0000;background:#F9F9F9;"> </span></p>The background will get <p><span style="color:#FF0000;background:#F9F9F9;">callback</span><span style="color:#FF0000;"> value, connect to </span><span style="color:#FF0000;">() </span><span style="color:#FF0000;">Put the data into </span><span style="color:#FF0000;">() </span><span style="color:#FF0000;">, return to the page, </span><span style="color:#FF0000;"></span><span style="color:#FF0000;">Equivalent to calling function</span></p>function<p><span style="color:#FF0000;">Name</span><span style="color:#FF0000;">(data)</span><span style="color:#FF0000;"></span><span style="color:#FF0000;">Three:</span></p><p><span style="color:#FF0000;"> </span><span style="color:#FF0000;">后台直接开启同源策略的访问限制，设置响应头信息。</span></p><p><span style="color:#FF0000;">response.setHeader("Access-Control-Allow-Origin","*");</span></p><p>22.如何控制网页在网络传输中的数据量？</p><p><span style="color:#FF0000;">分页加载，瀑布流，限制每次加载的数据量。</span><span style="color:#00B0F0;">(??????</span><span style="color:#00B0F0;">不确定</span><span style="color:#00B0F0;">)</span></p><p>23.前端常规开发优化策略？</p>
请减少HTTP请求
请正确理解 Repaint 和 Reflow
请减少对DOM的操作
使用JSON格式来进行数据交换
高效使用HTML标签和CSS样式
使用CDN加速（内容分发网络）
将CSS和JS放到外部文件中引用，CSS放头，JS放尾
精简CSS和JS文件（压缩）
压缩图片和使用图片Sprite技术
注意控制Cookie大小和污染
24.为什么异步加载JS文件？加载方式？
平时常用的引入JS方式，是同步模式，又称阻塞模式，会阻止浏览器的后续处理，停止了后续的解析，也就是说，浏览器在下载或执行该js代码块时，后面的标签不会被解析。
异步加载（async）JS文件，允许页面内容异步加载，仅适用于外部脚本。
延迟加载（defer）属性规定是否对脚本执行进行延迟，直到页面加载为止。
25.如果对一个js对象进行深度拷贝？
varajaxTimeoutTest = $.ajax({
url:'', //请求的URL
timeout : 1000, //超时时间设置，单位毫秒
type : 'get', //请求方式，get或post
data :{}, //请求所传参数，json格式
dataType:'json',//返回的数据格式
success:function(data){ //请求成功的回调函数
alert("成功");
},
complete : function(XMLHttpRequest,status){ //请求完成后最终执行参数
if(status=='timeout'){//超时,status还有success,error等值的情况
ajaxTimeoutTest.abort();//终止请求
alert("超时");
}
}
});26.JS中有哪些数据类型？
number boolean string underfind null
object function array
27.ajax交换模型？同步异步的区别？
触发事件调用函数
创建XMlHttpRequest 对象open连接，send发送后台服务器
后台接收前端数据，根据业务需求访问数据库进行增删改查
数据库返回后台程序所需要的数据
后台拿到数据库数据，进行合理的处理，比如JSON串，返回给前端
前端接收到后台的响应数据，进行解析，根据业务需求动态操作页面元素
28.如何添加HTML事件，三种。
1. 直接在html标签的属性上添加9bd932c2b6ec5985c154b9848f753cf2p94b3e26ee717c64999d7867364b1b4a3
2. 用dom的on...方法添加document.getElementById('p').onclick = function () {alert('p')};
3. 用事件监听addEventListener或attachEvent（IE）添加document.getElementById('p').addEventListener('click', function () {alert('p')}, false);
29.JS面向对象中继承的实现方式？
简单继承：
function A(x){
this.x=x;
}function B(x,y){
this.tmpObj=A;
this.tmpObj(x);
delete this.tmpObj;
this.y=y;
}完美继承：
function AA(x){
this.x = x;}AA.prototype.xxx = 2;function Obj(){
AA.call(this,22);
this.cc = 11;
this.constructor = arguments.callee;
}Obj.prototype = new AA();var obj = new Obj();
30.编写一个方法，判断字符串是否是这样的组成，第一个必须是字母，最后一个必须是数字。
function checkStr(str){
var diyige =str.subStr(0,1);
var dierge =str.subStr(str.length-1,1);
var reg = /^[a-zA-Z]$/
if(reg.test(diyige) &&!isNAN(dierge)){
//第一个是字母,最后一个是数字
}
}31.如何隐藏一个DOM元素？
Object.style.dispaly = “none”; || Object.style.visibility = “hidden”;
32.document.write，innerHTML和innertext区别是什么？
document.write只能重绘整个页面
innerHTML可以重绘页面的一部分(包含标签+文字)
innertext可以重绘页面的一部分(只包含文字)
33.字符串abcdefg把de换成12，b后面接le，写出JS。
var str = “abcdefg”; str = str.replace(“de”,”12”); str = str.replace(“b”,”b1e”);
或者
var str = “abcdefg”; str = str.split(“de”,”12”); var str1 =str.subString(0,str.indexOf(‘b’)+1); var str2 =str.subString(str.indexOf(‘b’)+1); str = str1+”1e”+str2;
34.判断每个字符出现的次数：hello，最后显示： h:1,e:1,l:2,o:1.
var str = “hello”;
var o = [];
for(var i = 0 ;i<str.length;i++){
if(str.indexOf(str[i]) == i){
o[str[i]] = str.split(str[i]).length-1;
}
}
console.log(o);35.使用CSS3动画效果实现一个小球的来回滚动。
36.h5的canvas画板如何实现会旋转的地球仪效果？（说出思想）
37.如何使过长的字体自动隐藏？
text-overflow: hidden ;
38.一个H5+C3的鼠标悬停效果？
39.移动端跟PC端的js文件区别？
40.如何处理一些手机端的兼容性？
41.IE浏览器兼容性，你了解哪些，简单举例子。
addEventListener() || attachEvent()
42.谈谈你对框架的理解。
对功能进行封装，使用者直接调用，或对样式进行预设置，使用者直接起名字
43.如何实现跨域？具体怎么实现？
第一种：
JSONP，利用传递方法名的方式，告诉后台前端方法名是什么，后台取到后，在名称后面拼接（），把数据（DATA）放到小括号中，返回前端，相当于返回：方法名（data）到前端后就直接调用这个方法了。
$.get(“ULR?callback=?”,function(data){
console.log(data);
})第二种：
前端正常Ajax访问，后台开启同源策略限制！
“Access-Control-Allow-Origin”,”*”
44.对后台语言了解几种，如果了解其中一种，举例说明一个？
45.与后台的交互，AJAX只是其中的一小部分，其他的知道吗？
46.在上一家公司的要上线作品的具体流程是什么？
前后台项目整合，测试，上线
47.手机端和PC端有什么区别，需要注意哪些方面？
本质上没有什么太大的区别，需要注意一些浏览器的兼容问题。
48.用JQ完整的写出AJAX与后台交互的方法。
$.get(“url”,function(data){
});
$.post(“url”,{data},function(data){
});
$.ajax({
url:””,
......
.....
....
});49.编写一段jq的方法扩展。
50.ECMAScript6怎么写class. 为什么会出现class这种东西？
51.如何判断一个对象是否属于某个类？
var obj = new String("abc");
alert(obj instanceof String);52.使用过哪些可视化控件？
53.什么是闭包？
简单理解成：定义在一个函数内部的函数
闭包本质：将函数内部和函数外部连接起来的一座桥梁
最大用处：
1、可以读取函数内部变量
2, is to keep these variables in the memory, that is, the closure can make its birth environment always exist
54.eval can calculate a certain String, is there a better way?
55. What else does initialization CSS do besides browser compatibility?
Recommended related articles: ajax video tutorial
The above is the detailed content of A summary of common AJAX interview questions. For more information, please follow other related articles on the PHP Chinese website!