Get the App
SLTechnology News&Howtos  ›  Development  › 

How does jQuery handle HTML events

Shulou Source: shulou.com Published: 2022-06-01 13:13:28 10月04日 Update

This article mainly shows you "jQuery how to deal with HTML events", the content is easy to understand, clear, hope to help you solve doubts, the following let the editor lead you to study and learn "jQuery how to deal with HTML events" this article.

JQuery event function

JQuery is specially designed for event handling.

The jQuery event handling method is the core function in jQuery.

Event handlers refer to methods that are called when certain events occur in the HTML.

You usually put jQuery code in a partial event handling method:

$(document) .ready (function () {$("button") .click (function () {$("p"). Hide ();}); This is a heading

This is a paragraph.

This is another paragraph.

Click me

Note: when the click event of a button is triggered, a function is called, which hides all

element.

Functions in separate files

If your site contains many pages and you want your jQuery function to be easy to maintain

Then put your jQuery function in a separate .js file, and then reference the file through the src property:

JQuery name conflict

JQuery uses the $symbol as an introduction to jQuery.

Functions in some other JavaScript libraries, such as Prototype, also use the $symbol.

JQuery uses a method called noConflict () to solve this problem.

Var jq=jQuery.noConflict (), which helps you use your own name (such as jq) instead of the $symbol.

$.noConflict (); jQuery (document) .ready (function () {jQuery ("button") .click (function () {jQuery ("p") .text ("jQuery is still running!") ;})

This is a paragraph.

Test jQuery

JQuery maintenance

JQuery is specially designed to handle HTML events, following the following principles to make the code more appropriate and easier to maintain:

Put all the jQuery code in the event handler

Place all event handlers in the document ready event handler

Put the jQuery code in a separate .js file

If there is a name conflict, rename the jQuery library

JQuery event method

$(document) .ready (function): binds a function to a document's ready event (when the document finishes loading)

$(selector) .click (function): a click event that triggers or binds a function to the selected element

$(selector) .dblclick (function): a double-click event that triggers or binds a function to the selected element

$(selector) .focus (function): the focus event that triggers or binds the function to the selected element

$(selector) .Mouseover (function): a mouse over event that triggers or binds a function to the selected element

The above is all the content of the article "how jQuery handles HTML events". Thank you for reading! I believe we all have a certain understanding, hope to share the content to help you, if you want to learn more knowledge, welcome to follow the industry information channel!

Tags: Events functions handling methods elements code files content names documents symbols articles help conflicts learning design appropriateness principles handlers properties Apple Docker Huawei Linux macOS MariaDB Microsoft MySQL NVidia OPPO Reno Redmi OPPO Reno Linux macOS MariaDB