What is the difference between xhtml and html?

1. What is the difference between xhtml and html

HTML is the same A basic WEB web design language, XHTML is based on XML Markup language

The main difference:

XHTML elements must be nested correctly.

The XHTML element must be closed.

Tag names must use lowercase letters.

XHTML The document must have a root element

2. Briefly describe the difference between src and href:

href points to the location of the network resource, establishes a link to the current element (anchor) or current document (link), and is used for hyperlinks.

src points to the location of the external resource. The content pointed to will be embedded in the document at the location of the current tag; when the src resource is requested, the resource it points to will be downloaded and applied to the document. Within, such as js scripts, img pictures, frames and other elements. When the browser parses this element, it will pause the downloading and processing of other resources until the resource is loaded, compiled, and executed. The same is true for elements such as pictures and frames, which is similar to embedding the pointed resource into the current tag. This is also why the js script is placed at the bottom instead of the head.

3. What are the inline elements? What are the block-level elements? What are the void elements?

Inline elements: a, b, span, img, input, strong, select, label, em, button, textarea

Block-level elements: div, ul, li, dl, dt, dd, p, h1-h6, blockquote

Empty elements: HTML elements with no content , for example: br, meta, hr, link, input, img

4, action in form Properties and methodWhat is the meaning of the properties? methodWhat are the commonly used values?

action attribute is used to specify the background program address of form form submission；method attribute is used to specify the form method for form submission. Common values ​​for

method are : get and post

5. What are the new attributes of form elements?

required： Required items

placeholder: Prompt information,will disappear when you click the input content

pattern:Verification regular expression

antofocus：Automatically obtain focus

aotucomplete:Autocomplete

6. What are the methods to submit data to the designated server?

Ajax Form

URL?Parameters

AngularJS’s $HTTP

JQ Ajax: $.POST(,,) $.GET(,,) $.Ajax({})

JS Ajax: 5 steps. (Refer to question 25)

7. Write a function to clear the spaces before and after the string. (Compatible with all browsers)

##function trim(str) {

if ( str && typeof str === "string") {

               Return str.replace(/(^\s*)|(\s*)$/ g,""); //Remove leading and trailing whitespace characters

# }

}

8. How to eliminate duplicate elements in an array?

var arr1 =[1,2,2,2,3,3,3,4,5,6],

var arr2 = [ ];

## If(arr2.indexOf(arr1[i]) < 0){

# arr2.push(arr1[i]);

}

}

document.write(arr2); // 1,2,3,4,5,6

##9. Please describe the difference between cookies, sessionStorage and localStorage

sessionStorage is used to locally store data in a session. These data can only be accessed by pages in the same session and the data will be destroyed when the session ends. Therefore sessionStorage is not a persistent local storage, only session-level storage. LocalStorage is used for persistent local storage. Unless the data is actively deleted, the data will never expire.

In addition, Web Storage has setItem, getItem, removeItem, clear and other methods. Unlike cookies, front-end developers need to encapsulate setCookie and getCookie themselves. But Cookies are also indispensable: Cookies are used to interact with the server and exist as part of the HTTP specification, while Web Storage is only created to "store" data locally. What is the difference between

##10, cookie

? ## Cookie is saved on the client machine；

Session is saved on the server side;

Contact: id of session Exists in cookie

11. When importing styles into the page, what is the difference between using link and @import?

1）.linkbelongs toXHTML tag, and @import is provided by CSS;

## 2) .When the page is loaded, link will be loaded simultaneously, and @ The CSS referenced by import will wait until the page is loaded before loading;

3 ) .import can only be recognized by IE5 and above, while link is XHTML tag, no compatibility issues;

4）.link The weight of the style>The weight of @import

12. Briefly describe the positioning Position:

Relative:Relative positioning. Relative to its original positioning, the original DOM space will be retained;

Absolute:Absolute positioning. Positioning relative to the first non-static positioned ancestor element will delete the original DOM space;

Fixed: Fixed locator window for positioning; will delete the DOM space

Static : default value. Without positioning, the elements appear in normal flow (ignoring the top, bottom, left, right z-index declarations).

Inherit: Specifies that the value of the position attribute is inherited from the parent element.

13. What are the values ​​of display? Explain their role.

block             Displayed like a block type element.

none         Default value. Displayed like an inline element type.

inline-block Displayed like an inline element, but its content is displayed like a block type element.

list-item Display like a block type element and add style list tags.

table     This element will be displayed as a block-level table

## inherit                                                                                                                                                     The value of the display attribute

、jqueryHow to convert an array into Convert to json string and then convert it back? $.parseJSON

$.fn.stringify = function() {

return JSON.stringify(this);

}

:$(array).stringify();

? JSON (JavaScript Object Notation)

JavaScript. The data format is simple, easy to read and write, occupies small bandwidth

{"age":"12", "name":"back"}##JSONConvert the string to

JSONObject:##var obj =eval('('+ str +')');

var obj = str.parseJSON();

var obj = JSON.parse(str);

JSONObject converted to

string: ##var last=obj.toJSONString();

16. What is responsive design? What are the basic principles of responsive design?

Based on the screen size, resolution, orientation, etc. of different devices, the unified website is displayed with different effects.

Mobile first. You can use JS to jump to different mobile sites and

PC sites, and you can use MediaQuery to detect the properties of different devices. Showing different CSS, various responsive front-end frameworks can be used. Advantages: Good user experience, especially on mobile phones.

Disadvantages: Contains a lot of redundant code, the development cost is high(But it is much lower than developing a mobile site

Mode)17. visibility

hiddenanddisplay: The difference between none?

Use display: noneAfter hiding, the space of the element is released, and other elements can occupy the space;

   function Person() {
    }
    Person.prototype.sayName() { alert(this.name); }
    var obj = {name: 'michaelqin'}; // 注意这是一个普通对象，它不是Person的实例
    1) apply
    Person.prototype.sayName.apply(obj, [param1, param2, param3]);
    2) call
    Person.prototype.sayName.call(obj, param1, param2, param3);
    3) bind
    var sn = Person.prototype.sayName.bind(obj);    
    sn([param1, param2, param3]); // bind需要先绑定，再执行 
   sn(param1, param2, param3); // bind需要先绑定，再执行