jquery Related Knowledge point 1

Source: Internet
Author: User
Tags dashed line getscript object object prev jquery library

The $ () in the 1--jquery library is:

The $ () function is the short name of the jquery () function. The $ () function is used to wrap any object into a jquery object, and then you can invoke several different methods defined on the jquery object. You can even pass a selector string to the $ () function, and a jquery object that contains an array of all matching DOM elements is returned.

2-Hide Picture when button is clicked

$ (". Button1"). Click (function () {

$ (". Image1"). Hide ();

})

3--$ (document). What is the function of ready ()? Why do you use it?

The Ready () function is used to execute code when a document enters the ready state. When the DOM is fully loaded, jquery allows you to execute the code. The biggest benefit of using the $ (document). Ready () is that it works with all browsers and avoids cross-browser challenges.

The difference between the 4-javascript Window.load event and the jquery ready function

The ²javascript Window.load event waits for the DOM to be created and waits for all external resources, including large pictures, audio, and video, to be fully loaded. If loading pictures and multimedia content takes a lot of time, the user will feel that the code defined on the Window.load event has a noticeable delay in execution. OnLoad can only be used in a single function.

The ²jquery ready () function simply waits on the DOM, without waiting for an image or external resource to load, thus performing faster. The JQuery ready function can be used more than once in a Web page, and the browser executes them in the order in which they appear in the HTML page.

What is the function of each () in 5-jquery? How do I use it?

each () function is used to iterate through the elements in the collection. Pass a function to each () method, and the called jquery object executes the incoming function on each of its elements.

$ (' [Name=nameofselectedtag]: Selected '). each (function (selected) {

Alert ($ (selected). text ());

});

6-How do I add an HTML element to the DOM tree?

Adds an existing element or a new HTML element to the end of the specified DOM element by using the Appendto () method.

7-Use jquery to select all hyperlinks within a paragraph?

The difference between the 8--$ (this) and the This keyword in jquery

$ (this) returns a JQuery object that can be called with multiple jquery methods, such as text () to get the literal, and Val () to get the value. This represents the current element, which represents the current DOM element in the context, and cannot be called by the jquery method unless it is wrapped by the $ () function.

What kinds of selectors are there in 9--jquery?

Basic selector: Returns a matching DOM element directly based on the ID, CSS class name, element name.

Hierarchy selector: Also called a path selector, you can select the appropriate DOM element based on the path hierarchy.

Filter selector: Filters the relevant conditions on the previous basis to get a matching DOM element.

10-use jquery to set the border of all elements on the page to a 2px wide dashed line

$ ("*"). CSS ("Border", "2px dotted Red");

11-click the button to bring up a dialog via jquery?

<input id= "Inputfield" type= "text" size= "/>"

$ (document). Ready (function () {

$ ("#button1"). Click (function () {

Alert ($ ("#inputField"). attr ("value"));

});

});

What is the function of the delegate () function in 12--jquery?

Answer: Delegate () will be used in the following two cases:

(1) If you have a parent element that needs to add an event to the child element under it, then you can use Delegate () and the code is as follows:

function (){
$ (this). Hide ();
});

(2) When the element is not available in the current page, you can use Delegate ()

13-jquery encoding and decoding URLs

encodeURIComponent (URL)

decodeURIComponent (URL)

14--How do I disable the browser's forward back button with jquery?
$ (document). Ready (function() {
Window.history.forward (1); OR
Window.history.forward (-1);
});

15-Why Use jquery

jquery is a lightweight framework with powerful selectors, excellent DOM manipulation encapsulation, reliable event handling mechanisms, perfect Ajax, excellent browser compatibility, and support for chained operations, implicit iterations. The behavior layer and the structure layer are separated, support the rich plugin, the document is also very rich.

16-jquery and CSS are different for both selectors

The jquery selector supports selectors in CSS. Can be used to add styles and the corresponding behavior; CSS selectors can only add styles.

How 17-jquery objects and Dom objects are converted

jquery to DOM object: The jquery object is an array object that can be enriched with [index] to get the corresponding Dom object, and the corresponding DOM object can be obtained through get[index].

Dom object to jquery object: $ (DOM object)

Differences between $.get () submissions and $.post () submissions in 18-jquery

The $.get () method uses the Get method to make an asynchronous request, and the $.post () method uses the Post method to make an asynchronous request.

A GET request passes the entry to the URL, and the POST request is sent to the Web server as the entity content of the HTTP message, which is not visible to the user.

The Get method passes a smaller amount of data than post.

The data requested by the Get method is cached by the browser, causing security problems.

General use of the Load method in 19-jquery

The Load method is typically used when loading remote HTML code and inserting it into the DOM, usually to get a static data file from the server. You can use $.get () or $.post () if you want to pass the parameter.

20-How to manipulate styles in jquery

AddClass () Append style, removeclass () Delete style, toggle () Toggle Style

21-jquery How the event is handled

Load the document first, and when the page is loaded, the browser will add events to the DOM element via JavaScript.

Animations in the 22-jquery

Hide () and show () modify multiple style properties, such as height, width, and opacity. FadeIn () and fadeout (), FadeTo () only change the transparency.

Showup () and Slidedown (), Slidetoggle () only change height.

Animate () A way to customize animations

23-jquery Plug-in

24-What is the general purpose of submitting data, and why

$.post () method

If you need to set Beforesend (pre-commit callback function), error (post-failure processing), success (post-processing), complete (post-request processing) callback function, etc., this time select $.ajax ()

There are several ways to introduce CSS in 25-jquery

inline, in-line, imported, link-type

26-jquery to dynamically add and delete table rows?

How to implement the insertion node in 27-jquery and the difference between them

Append (), AppendTo (), prepend (), Prependto (), after (), InsertAfter (), before (), InsertBefore ()

Roughly divided into internal append and external append

Append () indicates that content is appended to each element, and AppendTo () indicates that all elements are appended to the specified element.

28-Methods and benefits of wrapping nodes

Wrapall (), wrap (), Wrapinner ()

29-jquery How do I get and set properties?

The attr () method can get and set element properties

Removeattr () method to delete element properties

Which methods in 30-jquery can traverse nodes

Children (): Gets a collection of child elements of the matching element, considering only that the child element does not consider the descendant elements

Next (): Gets the sibling element immediately following the matching element

Prev (): Gets the sibling element immediately preceding the match element

Siblings (): Get all sibling elements before and after matching elements

Closest (): Gets the closest match element

Find (): Gets a collection of elements in the matching element, including descendants and descendants

31-The difference between a child element selector and a descendant element selector

Child elements: All elements under a child node

Descendant elements: Elements in child nodes or subnodes of child nodes

The role of the 32-beforesend method

You can modify the function of the XMLHttpRequest object before sending the request, and in Beforesend if you return False, you can cancel the AJAX request. The XMLHttpRequest object is the only parameter, so it can be verified in this method.

33-How to use JSON in Ajax

$.getjson () to load a JSON file

34-What are the selectors for the query nodes?

: First Query

: Last Query

: Odd query odd but index starting from 0

: Even query even

: EQ (index) query for equal

: GT (Index) query is larger than index

: LT (index) query is less than index

: Header selects all headings

35-nextall () and $ (' prev~siblings ') equivalent

36-jquery There are several ways to set and get styles

AddClass (), attr ()

How does the 37-jquery handle caching?

Caching is disabled to handle the cache.

By using the $.post () method to get the data, the default is to disable caching.

Data is obtained through the $.get () method, which can be avoided by setting a timestamp. You can add a + (+new Date) Example $.get (' Ajax.xml? ') after the URL. +new Date), function () {});

The Ajax method to get the data, as long as the cache:false can be set

The difference between the 38--$.getscript () method and the $.getjson () method

$.getscript (): Can directly load JS file, and do not need to process the JS file, JS file will be automatically executed

$.getjson (): For loading JSON files

39--

$ ("#msg"). Text (): Returns the textual content of the element node with the ID msg

$ ("#msg"). Text ("<b>new content</b>"): Writes <b>new content</b> as a plain text string in element node content with ID msg, the page displays bold <b>new content</b>.

40-radio the second element of a radio box group is the currently selected value, how to fetch

$ (' input[name=items] '). Get (1). Checked=true;

41-The difference between the ID and class in the selector

ID: Each ID name can be used only once

Class: Can be reused

42-What data formats have been used and their characteristics

HTML format: providing external data

JSON format: Data that needs to be reused

XML format: When the remote application is unknown, XML provides the most reliable guarantee for good interoperability.

What can 43-jquery do?

Get the elements of the page, modify the appearance of the page, change the contents of the page, respond to the user's page actions, add dynamic effects to the page, and do not need to refresh the page, that is, you can get information from the server, simplifying common JavaScript tasks.

44-There are several main ways to data in Ajax?

Three kinds: HTML stitching, JSON array, form form serialize () serialized

The difference between hover () and toggle () in 45-jquery

Hover (), toggle () are the two synthetic events in jquery. The former is used to simulate cursor hover events, which are used for continuous click events.

How event bubbling in 46-jquery is performed and how to prevent event bubbling

Event bubbling is triggered from inside out. The Stoppropagation () method is provided in jquery to stop the bubbling event.

47-- For example, clicking the hyperlink will automatically jump, click the "Submit" button after the form will be submitted, etc., sometimes I want to block these default behavior, what should I do?

You can use Event.preventdefault () or return False in the event handler, that is, return false;

48--jquery form is there a few verification methods before submission? What is the difference??

A) FormData: Returns an array that can be checked by a loop call to verify

b) Jaform: Returns a JQuery object, all of which need to be converted to a DOM object first

c) Fieldvalue: Returns an array of Beforesend ()

49--have you ever written a plugin in jquery, what are the benefits of plugins? Have you written those plugins? Should it pay attention to those?

A) Benefits of plug-ins: Encapsulation of existing series of methods or functions to be re-used elsewhere to facilitate later maintenance and improved development efficiency

b) Plug-in classification: Encapsulating object Method Plug-in, encapsulating global function plug-in, selector plug-in

b) Place of attention:

I. 1. The file name of the plugin is named jquery. [plugin name].js to avoid confusion with other JavaScript library plugins

Ii. 2. All object methods should be attached to the Jquery.fn object, and all global functions should be attached to the jquery object itself

Iii. 3. Plug-ins should return a jquery object to ensure the plug-in's chained operation

Iv. 4. Avoid using $ as an alias for jquery objects inside a plug-in, instead use full jquery to avoid conflicts or use closures to avoid

V. 5. All methods or function plug-ins, should be a good end, or compression may occur when the problem. Add a semicolon to the plugin's head, which will prevent other people's irregular code from affecting the plugin.

Vi. 6. Encapsulating the global function through $.extent ({}) in the plug-in, the selector plug-in, extending the existing Object object through $.fn.extend ({}) Encapsulating the object method plug-in

What is the method chain in 50--jQuery? What are the benefits of using a method chain?

The method chain is calling another method on the result returned by one method, which makes the code straightforward and performs better with a single round of lookups for the DOM.

jquery Related Knowledge point 1

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.