HTML oncut Attribute - askthedev.com

The oncut attribute in HTML is an essential part of handling user interactions, particularly when dealing with text input. This attribute allows developers to execute specific JavaScript code when a user cuts (removes) text from a text field or area, enabling dynamic responses to user actions. This article will explore the oncut attribute in detail, its syntax, its significance in web development, and provide practical examples to help beginners understand its usage.

I. Introduction

The oncut attribute is an event attribute that can be added to HTML elements like and . It triggers when the user cuts content, enabling developers to create interactive and responsive applications that enhance user experience. Understanding how to implement and utilize this attribute can significantly improve both the functionality of a web application and the user experience.</p> <h2>II. Browser Compatibility</h2> <p>Before using the oncut attribute, it is crucial to understand its compatibility across different browsers. The following table showcases <strong>browser support</strong> for the oncut attribute:</p> <table border="1" style="width:100%; border-collapse: collapse;"> <tr> <th>Browser</th> <th>Supported</th> </tr> <tr> <td>Google Chrome</td> <td>Yes</td> </tr> <tr> <td>Mozilla Firefox</td> <td>Yes</td> </tr> <tr> <td>Safari</td> <td>Yes</td> </tr> <tr> <td>Microsoft Edge</td> <td>Yes</td> </tr> </table> <h2>III. Syntax</h2> <p>Using the <strong>oncut</strong> attribute is straightforward. Below is the basic syntax structure:</p> <pre><code><element oncut="JavaScript Code">Content</element></code></pre> <p>Here are a few examples demonstrating how to use the oncut attribute with various HTML elements:</p> <pre><code><input type="text" oncut="alert('Text cut!')"> <textarea oncut="console.log('Text has been cut.')"></textarea></code></pre> <h2>IV. Event Attributes</h2> <p><strong>Event attributes</strong> are specialized attributes in HTML that allow the execution of JavaScript code in response to specific events. The oncut attribute belongs to this category, along with other attributes such as onpaste and oncopy. These attributes enable developers to create interactive web applications that respond immediately to user input.</p> <h2>V. Example</h2> <p>Let’s create a simple example that showcases the oncut attribute in action:</p> <pre><code><!DOCTYPE html> <html> <head> <title>oncut Example</title> <script> function notifyCut() { alert('You cut some text!'); } </script> </head> <body> <h1>Cut Text example</h1> <textarea oncut="notifyCut()" rows="4" cols="50">Try cutting this text...</textarea> </body> </html></code></pre> <p>In this example, a user can cut text from the textarea, which triggers the <strong>notifyCut</strong> function, displaying an alert message. This illustrates how the oncut attribute can enhance user interaction.</p> <h2>VI. Related Attributes</h2> <p>There are several attributes related to user input events in HTML:</p> <ul> <li><strong>onpaste</strong>: Executes code when the user pastes text into an element.</li> <li><strong>oncopy</strong>: Executes code when the user copies text from an element.</li> </ul> <p>The oncut attribute operates similarly to these attributes, allowing developers to manage user interactions effectively. Below is a comparison table of these attributes:</p> <table border="1" style="width:100%; border-collapse: collapse;"> <tr> <th>Attribute</th> <th>Event Triggered</th> <th>Usage Example</th> </tr> <tr> <td>oncut</td> <td>Text is cut from an element</td> <td><input oncut=”function()”></td> </tr> <tr> <td>onpaste</td> <td>Text is pasted into an element</td> <td><input onpaste=”function()”></td> </tr> <tr> <td>oncopy</td> <td>Text is copied from an element</td> <td><input oncopy=”function()”></td> </tr> </table> <h2>VII. Conclusion</h2> <p>In conclusion, the <strong>oncut</strong> attribute is a valuable tool for web developers aiming to create interactive and responsive web applications. By understanding its functionality and practical implementation, developers can enhance user experiences significantly. Implementing the oncut attribute, along with its related attributes, enables better user interaction with forms and text areas, making modern applications more dynamic.</p> <h2>FAQs</h2> <h3>1. What is the purpose of the oncut attribute?</h3> <p>The oncut attribute is used to execute JavaScript code when the user cuts text from an input or textarea element.</p> <h3>2. Are there specific HTML elements where the oncut attribute can be used?</h3> <p>The oncut attribute can be utilized with elements such as <input> and <textarea> that allow text input.</p> <h3>3. How can I test if the oncut attribute works in my browser?</h3> <p>You can test the oncut attribute by implementing it in an HTML file, using the examples provided, and checking if the specified action is triggered upon cutting text.</p> <h3>4. Is the oncut attribute compatible with all browsers?</h3> <p>Yes, the oncut attribute is widely supported across popular browsers such as Google Chrome, Mozilla Firefox, Safari, and Microsoft Edge.</p> <h3>5. Can I use the oncut attribute with other event attributes?</h3> <p>Absolutely! The oncut attribute can be used alongside other event attributes like onpaste and oncopy to provide a comprehensive user interaction experience.</p> <p></body></p> </div> </div> <footer> <div class="post-share"> <span><i class="icon-share"></i><span>Share This Article</span></span> <ul class="social-icons list-unstyled mb-0 d-flex align-items-center"> <li class="share-facebook"> <a target="_blank" href="http://www.facebook.com/sharer.php?u=https://askthedev.com/html-oncut-attribute/&t=HTML+oncut+Attribute"> <i class="icon-facebook"></i><span> <span>Facebook</span></span> </a> </li> <li class="share-twitter"> <a target="_blank" href="http://twitter.com/share?text=HTML+oncut+Attribute&url=https://askthedev.com/html-oncut-attribute/"> <i class="icon-twitter"></i><span></span> </a> </li> <li class="share-linkedin"> <a target="_blank" href="http://www.linkedin.com/shareArticle?mini=true&url=https://askthedev.com/html-oncut-attribute/&title=HTML+oncut+Attribute"> <i class="icon-linkedin"></i><span></span> </a> </li> <li class="share-whatsapp"> <a target="_blank" href="https://api.whatsapp.com/send?text=HTML+oncut+Attribute - https://askthedev.com/html-oncut-attribute/"> <i class="fab fa-whatsapp"></i><span></span> </a> </li> </ul> </div> </footer> </div> <script type="application/ld+json">{"@context":"http:\/\/schema.org","@type":"Article","dateCreated":"2024-09-29T23:07:57+05:30","datePublished":"2024-09-29T23:07:57+05:30","dateModified":"2024-09-29T23:07:57+05:30","headline":"HTML oncut Attribute","name":"HTML oncut Attribute","keywords":[],"url":"https:\/\/askthedev.com\/html-oncut-attribute\/","description":"The oncut attribute in HTML is an essential part of handling user interactions, particularly when dealing with text input. This attribute allows developers to execute specific JavaScript code when a u","copyrightYear":"2024","articleSection":"HTML TAGS","articleBody":"\nThe oncut attribute in HTML is an essential part of handling user interactions, particularly when dealing with text input. This attribute allows developers to execute specific JavaScript code when a user cuts (removes) text from a text field or area, enabling dynamic responses to user actions. This article will explore the oncut attribute in detail, its syntax, its significance in web development, and provide practical examples to help beginners understand its usage.\n\nI. Introduction\nThe oncut attribute is an event attribute that can be added to HTML elements like and . It triggers when the user cuts content, enabling developers to create interactive and responsive applications that enhance user experience. Understanding how to implement and utilize this attribute can significantly improve both the functionality of a web application and the user experience.\n\nII. Browser Compatibility\nBefore using the oncut attribute, it is crucial to understand its compatibility across different browsers. The following table showcases browser support for the oncut attribute:\n\n\n \n Browser\n Supported\n \n \n Google Chrome\n Yes\n \n \n Mozilla Firefox\n Yes\n \n \n Safari\n Yes\n \n \n Microsoft Edge\n Yes\n \n\n\nIII. Syntax\nUsing the oncut attribute is straightforward. Below is the basic syntax structure:\n\n<element oncut=\"JavaScript Code\">Content<\/element>\n\nHere are a few examples demonstrating how to use the oncut attribute with various HTML elements:\n\n<input type=\"text\" oncut=\"alert('Text cut!')\">\n<textarea oncut=\"console.log('Text has been cut.')\"><\/textarea>\n\nIV. Event Attributes\nEvent attributes are specialized attributes in HTML that allow the execution of JavaScript code in response to specific events. The oncut attribute belongs to this category, along with other attributes such as onpaste and oncopy. These attributes enable developers to create interactive web applications that respond immediately to user input.\n\nV. Example\nLet\u2019s create a simple example that showcases the oncut attribute in action:\n\n<!DOCTYPE html>\n<html>\n<head>\n <title>oncut Example<\/title>\n <script>\n function notifyCut() {\n alert('You cut some text!');\n }\n <\/script>\n<\/head>\n<body>\n <h1>Cut Text example<\/h1>\n <textarea oncut=\"notifyCut()\" rows=\"4\" cols=\"50\">Try cutting this text...<\/textarea>\n<\/body>\n<\/html>\n\nIn this example, a user can cut text from the textarea, which triggers the notifyCut function, displaying an alert message. This illustrates how the oncut attribute can enhance user interaction.\n\nVI. Related Attributes\nThere are several attributes related to user input events in HTML:\n\n onpaste: Executes code when the user pastes text into an element.\n oncopy: Executes code when the user copies text from an element.\n\nThe oncut attribute operates similarly to these attributes, allowing developers to manage user interactions effectively. Below is a comparison table of these attributes:\n\n\n \n Attribute\n Event Triggered\n Usage Example\n \n \n oncut\n Text is cut from an element\n <input oncut=\"function()\">\n \n \n onpaste\n Text is pasted into an element\n <input onpaste=\"function()\">\n \n \n oncopy\n Text is copied from an element\n <input oncopy=\"function()\">\n \n\n\nVII. Conclusion\nIn conclusion, the oncut attribute is a valuable tool for web developers aiming to create interactive and responsive web applications. By understanding its functionality and practical implementation, developers can enhance user experiences significantly. Implementing the oncut attribute, along with its related attributes, enables better user interaction with forms and text areas, making modern applications more dynamic.\n\nFAQs\n1. What is the purpose of the oncut attribute?\nThe oncut attribute is used to execute JavaScript code when the user cuts text from an input or textarea element.\n\n2. Are there specific HTML elements where the oncut attribute can be used?\nThe oncut attribute can be utilized with elements such as and that allow text input.\n\n3. How can I test if the oncut attribute works in my browser?\nYou can test the oncut attribute by implementing it in an HTML file, using the examples provided, and checking if the specified action is triggered upon cutting text.\n\n4. Is the oncut attribute compatible with all browsers?\nYes, the oncut attribute is widely supported across popular browsers such as Google Chrome, Mozilla Firefox, Safari, and Microsoft Edge.\n\n5. Can I use the oncut attribute with other event attributes?\nAbsolutely! The oncut attribute can be used alongside other event attributes like onpaste and oncopy to provide a comprehensive user interaction experience.\n","publisher":{"@id":"#Publisher","@type":"Organization","name":"askthedev.com","logo":{"@type":"ImageObject","url":"https:\/\/askthedev.com\/wp-content\/uploads\/2024\/09\/AsktheDev.com_.png"}},"sourceOrganization":{"@id":"#Publisher"},"copyrightHolder":{"@id":"#Publisher"},"mainEntityOfPage":{"@type":"WebPage","@id":"https:\/\/askthedev.com\/html-oncut-attribute\/"},"author":{"@type":"Person","name":"anonymous user","url":"https:\/\/askthedev.com\/profile\/keerthishivatejagmail-com\/"}}</script> </article> <div class="related-post related-post-links"> <div class="post-inner"> <h3 class="section-title">Related Posts</h3> <ul> <li> <a href="https://askthedev.com/html-audio-and-video-duration-property/" title="HTML Audio and Video Duration Property" rel="bookmark"><i class="icon-right-thin"></i>HTML Audio and Video Duration Property</a> </li> <li> <a href="https://askthedev.com/audio-and-video-duration-property/" title="Audio and Video Duration Property" rel="bookmark"><i class="icon-right-thin"></i>Audio and Video Duration Property</a> </li> <li> <a href="https://askthedev.com/html-and-duration-property/" title="HTML `` and `` Duration Property" rel="bookmark"><i class="icon-right-thin"></i>HTML `` and `` Duration Property</a> </li> <li> <a href="https://askthedev.com/input-alt-attribute-in-html/" title="Input Alt Attribute in HTML" rel="bookmark"><i class="icon-right-thin"></i>Input Alt Attribute in HTML</a> </li> <li> <a href="https://askthedev.com/html-li-value-attribute-2/" title="HTML li Value Attribute" rel="bookmark"><i class="icon-right-thin"></i>HTML li Value Attribute</a> </li> <li> <a href="https://askthedev.com/html-area-href-attribute/" title="HTML Area Href Attribute" rel="bookmark"><i class="icon-right-thin"></i>HTML Area Href Attribute</a> </li> <li> <a href="https://askthedev.com/html-track-label-attribute/" title="HTML track label Attribute" rel="bookmark"><i class="icon-right-thin"></i>HTML track label Attribute</a> </li> <li> <a href="https://askthedev.com/html-video-poster-attribute/" title="HTML Video Poster Attribute" rel="bookmark"><i class="icon-right-thin"></i>HTML Video Poster Attribute</a> </li> <li> <a href="https://askthedev.com/html-oncuechange-attribute/" title="HTML oncuechange Attribute" rel="bookmark"><i class="icon-right-thin"></i>HTML oncuechange Attribute</a> </li> <li> <a href="https://askthedev.com/utf-basic-latin-character-set-2/" title="UTF Basic Latin Character Set" rel="bookmark"><i class="icon-right-thin"></i>UTF Basic Latin Character Set</a> </li> </ul> <div class="clearfix"></div> </div> </div> <div id="respond-all" class=""> <div id="respond" class="comment-respond"> <h3 class="section-title">Leave a comment<div class="cancel-comment-reply"><a rel="nofollow" id="cancel-comment-reply-link" href="/html-oncut-attribute/#respond" style="display:none;">Cancel reply</a></div></h3><div class="alert-message alert-message-warning"><i class="icon-flag"></i><p>You must login to add a new comment.</p></div><div class="wpqa_login_social"><div class="nsl-container nsl-container-block" data-align="left"><div class="nsl-container-buttons"><a href="https://askthedev.com/wp-login.php?loginSocial=google&redirect=https%3A%2F%2Faskthedev.com%2Fhtml-oncut-attribute%2F" rel="nofollow" aria-label="Continue with <b>Google</b>" data-plugin="nsl" data-action="connect" data-provider="google" data-popupwidth="600" data-popupheight="600"><div class="nsl-button nsl-button-default nsl-button-google" data-skin="light" style="background-color:#fff;"><div class="nsl-button-svg-container"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path fill="#4285F4" d="M20.64 12.2045c0-.6381-.0573-1.2518-.1636-1.8409H12v3.4814h4.8436c-.2086 1.125-.8427 2.0782-1.7959 2.7164v2.2581h2.9087c1.7018-1.5668 2.6836-3.874 2.6836-6.615z"></path><path fill="#34A853" d="M12 21c2.43 0 4.4673-.806 5.9564-2.1805l-2.9087-2.2581c-.8059.54-1.8368.859-3.0477.859-2.344 0-4.3282-1.5831-5.036-3.7104H3.9574v2.3318C5.4382 18.9832 8.4818 21 12 21z"></path><path fill="#FBBC05" d="M6.964 13.71c-.18-.54-.2822-1.1168-.2822-1.71s.1023-1.17.2823-1.71V7.9582H3.9573A8.9965 8.9965 0 0 0 3 12c0 1.4523.3477 2.8268.9573 4.0418L6.964 13.71z"></path><path fill="#EA4335" d="M12 6.5795c1.3214 0 2.5077.4541 3.4405 1.346l2.5813-2.5814C16.4632 3.8918 14.426 3 12 3 8.4818 3 5.4382 5.0168 3.9573 7.9582L6.964 10.29C7.6718 8.1627 9.6559 6.5795 12 6.5795z"></path></svg></div><div class="nsl-button-label-container">Continue with <b>Google</b></div></div></a></div></div><div class="wpqa_login_social_div"><span>or use</span></div> </div><form class="wpqa_form login-form wpqa_login" method="post"> <div class="wpqa_error_desktop"><div class="wpqa_error"></div></div> <div class="form-inputs clearfix"> <p class="login-text"> <label for="username_182">Username or email<span class="required">*</span></label> <input id="username_182" class="required-item form-control" autocomplete="username" type="text" name="log" value=""> <i class="icon-user"></i> </p> <p class="login-password"> <label for="password_182">Password<span class="required">*</span></label> <input id="password_182" class="required-item form-control" autocomplete="current-password" type="password" name="pwd"> <i class="icon-lock-open"></i> </p> </div> <div class="d-flex align-items-center justify-content-between mb-4 login-form-data"> <div class="wpqa_checkbox_p rememberme normal_label d-flex align-items-center mb-1"> <label class="mb-0"><span class="wpqa_checkbox"><input type="checkbox" name="rememberme" value="forever" checked="checked"></span> <span class="wpqa_checkbox_span">Remember Me!</span></label> </div> <a href="https://askthedev.com/lost-password-dont/" class="font-weight-bold color-dark mb-1 lost-password">Forgot Password?</a> </div> <div class="clearfix"></div> <div class="wpqa_error_mobile"><div class="wpqa_error"></div></div> <p class="form-submit login-submit d-flex align-items-center justify-content-between mb-0"> <span class="load_span"><span class="loader_2"></span></span> <input type="submit" value="Login" class="button-default login-submit"> </p> <input type="hidden" name="redirect_to" value="https://askthedev.com/html-oncut-attribute/"> <input type="hidden" name="form_type" value="wpqa-login"> <input type="hidden" name="action" value="wpqa_ajax_login_process"> </form><div class="pop-footer pop-footer-comments">Need An Account, <a href="https://askthedev.com/sign-up/" class="signup-panel">Sign Up Here</a></div><div class="wpqa_login_social"><div class="nsl-container nsl-container-block" data-align="left"><div class="nsl-container-buttons"><a href="https://askthedev.com/wp-login.php?loginSocial=google&redirect=https%3A%2F%2Faskthedev.com%2Fhtml-oncut-attribute%2F" rel="nofollow" aria-label="Continue with <b>Google</b>" data-plugin="nsl" data-action="connect" data-provider="google" data-popupwidth="600" data-popupheight="600"><div class="nsl-button nsl-button-default nsl-button-google" data-skin="light" style="background-color:#fff;"><div class="nsl-button-svg-container"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path fill="#4285F4" d="M20.64 12.2045c0-.6381-.0573-1.2518-.1636-1.8409H12v3.4814h4.8436c-.2086 1.125-.8427 2.0782-1.7959 2.7164v2.2581h2.9087c1.7018-1.5668 2.6836-3.874 2.6836-6.615z"></path><path fill="#34A853" d="M12 21c2.43 0 4.4673-.806 5.9564-2.1805l-2.9087-2.2581c-.8059.54-1.8368.859-3.0477.859-2.344 0-4.3282-1.5831-5.036-3.7104H3.9574v2.3318C5.4382 18.9832 8.4818 21 12 21z"></path><path fill="#FBBC05" d="M6.964 13.71c-.18-.54-.2822-1.1168-.2822-1.71s.1023-1.17.2823-1.71V7.9582H3.9573A8.9965 8.9965 0 0 0 3 12c0 1.4523.3477 2.8268.9573 4.0418L6.964 13.71z"></path><path fill="#EA4335" d="M12 6.5795c1.3214 0 2.5077.4541 3.4405 1.346l2.5813-2.5814C16.4632 3.8918 14.426 3 12 3 8.4818 3 5.4382 5.0168 3.9573 7.9582L6.964 10.29C7.6718 8.1627 9.6559 6.5795 12 6.5795z"></path></svg></div><div class="nsl-button-label-container">Continue with <b>Google</b></div></div></a></div></div></div> </div> </div> </div> <div class="clearfix"></div> <div class="pagination-wrap pagination-post no-pagination-wrap"> </div> </section> </div> </div> <div class="hide-main-inner"></div> <div class="hide-sidebar sidebar-width"><div class="hide-sidebar-inner"></div></div> <aside class="sidebar footer-sidebar sidebar-width float_l fixed-sidebar"> <h3 class="screen-reader-text">Sidebar</h3> <div class="inner-sidebar"> <section id="block-4" class="widget widget_block"> <div class="wp-block-group"><div class="wp-block-group__inner-container is-layout-flow wp-block-group-is-layout-flow"> <h2 class="wp-block-heading">Recent Answers</h2> <ol class="wp-block-latest-comments"><li class="wp-block-latest-comments__comment"><article><footer class="wp-block-latest-comments__comment-meta"><a class="wp-block-latest-comments__comment-author" href="https://askthedev.com">anonymous user</a> on <a class="wp-block-latest-comments__comment-link" href="https://askthedev.com/question/how-do-games-using-havok-manage-rollback-netcode-without-corrupting-internal-state-during-save-load-operations/#comment-54865">How do games using Havok manage rollback netcode without corrupting internal state during save/load operations?</a></footer></article></li><li class="wp-block-latest-comments__comment"><article><footer class="wp-block-latest-comments__comment-meta"><a class="wp-block-latest-comments__comment-author" href="https://askthedev.com">anonymous user</a> on <a class="wp-block-latest-comments__comment-link" href="https://askthedev.com/question/how-do-games-using-havok-manage-rollback-netcode-without-corrupting-internal-state-during-save-load-operations/#comment-54864">How do games using Havok manage rollback netcode without corrupting internal state during save/load operations?</a></footer></article></li><li class="wp-block-latest-comments__comment"><article><footer class="wp-block-latest-comments__comment-meta"><a class="wp-block-latest-comments__comment-author" href="https://askthedev.com">anonymous user</a> on <a class="wp-block-latest-comments__comment-link" href="https://askthedev.com/question/how-can-i-efficiently-determine-line-of-sight-between-points-in-various-3d-grid-geometries-without-surface-intersection/#comment-54863">How can I efficiently determine line of sight between points in various 3D grid geometries without surface intersection?</a></footer></article></li><li class="wp-block-latest-comments__comment"><article><footer class="wp-block-latest-comments__comment-meta"><a class="wp-block-latest-comments__comment-author" href="https://askthedev.com">anonymous user</a> on <a class="wp-block-latest-comments__comment-link" href="https://askthedev.com/question/how-can-i-efficiently-determine-line-of-sight-between-points-in-various-3d-grid-geometries-without-surface-intersection/#comment-54862">How can I efficiently determine line of sight between points in various 3D grid geometries without surface intersection?</a></footer></article></li><li class="wp-block-latest-comments__comment"><article><footer class="wp-block-latest-comments__comment-meta"><a class="wp-block-latest-comments__comment-author" href="https://askthedev.com">anonymous user</a> on <a class="wp-block-latest-comments__comment-link" href="https://askthedev.com/question/how-can-i-update-the-server-about-my-hotbar-changes-in-a-fabricmc-mod/#comment-54861">How can I update the server about my hotbar changes in a FabricMC mod?</a></footer></article></li></ol></div></div> </section> <section class="widget-footer"> <ul id="footer_menu" class="menu"><li id="menu-item-1575" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-home menu-item-1575"><a class="" href="https://askthedev.com/">Home</a></li> <li id="menu-item-22255" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-22255"><a class="" href="https://askthedev.com/learn/">Learn Something</a></li> <li id="menu-item-1228" class="wpqa-menu wpqa-add-question-nav menu-item menu-item-type-custom menu-item-object-custom menu-item-1228 li-add-question"><a class="" href="https://askthedev.com/add-question/">Ask a Question</a></li> <li id="menu-item-1227" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-1227"><a class="" href="https://askthedev.com/?show=no-answers">Answer Unanswered Questions</a></li> <li id="menu-item-1576" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-privacy-policy menu-item-1576"><a class="" href="https://askthedev.com/privacy-policy/">Privacy Policy</a></li> <li id="menu-item-1577" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-1577"><a class="" href="https://askthedev.com/terms-conditions/">Terms & Conditions</a></li> </ul> <div class="clearfix"></div> <p class="credits">© askthedev ❤️ All Rights Reserved</p> </section> </div> </aside> </main> <nav class="nav_menu float_r fixed_nav_menu nav_menu_3"> <h3 class="screen-reader-text">Explore</h3> <ul id="menu-trending" class="menu"><li class="menu-item menu-item-type-custom menu-item-object-custom menu-item-2131"><a class="" href="https://askthedev.com/question-category/ubuntu/">Ubuntu</a></li> <li class="menu-item menu-item-type-custom menu-item-object-custom menu-item-1542"><a class="" href="https://askthedev.com/question-category/python/">Python</a></li> <li class="menu-item menu-item-type-custom menu-item-object-custom menu-item-1541"><a class="" href="https://askthedev.com/question-category/javascript/">JavaScript</a></li> <li class="menu-item menu-item-type-custom menu-item-object-custom menu-item-2129"><a class="" href="https://askthedev.com/question-category/linux/">Linux</a></li> <li class="menu-item menu-item-type-custom menu-item-object-custom menu-item-1540"><a class="" href="https://askthedev.com/question-category/git/">Git</a></li> <li class="menu-item menu-item-type-custom menu-item-object-custom menu-item-2135"><a class="" href="https://askthedev.com/question-category/windows/">Windows</a></li> <li class="menu-item menu-item-type-custom menu-item-object-custom menu-item-2127"><a class="" href="https://askthedev.com/question-category/html/">HTML</a></li> <li class="menu-item menu-item-type-custom menu-item-object-custom menu-item-2130"><a class="" href="https://askthedev.com/question-category/sql/">SQL</a></li> <li class="menu-item menu-item-type-custom menu-item-object-custom menu-item-1539"><a class="" href="https://askthedev.com/question-category/aws/">AWS</a></li> <li class="menu-item menu-item-type-custom menu-item-object-custom menu-item-2133"><a class="" href="https://askthedev.com/question-category/docker/">Docker</a></li> <li class="menu-item menu-item-type-custom menu-item-object-custom menu-item-10678"><a class="" href="https://askthedev.com/question-category/kubernetes/">Kubernetes</a></li> </ul> </nav> </div> </div> </div> </div> <div class="go-up"><i class="icon-up-open-big"></i></div> <a href="https://askthedev.com/add-question/" title="Ask a question" class="ask-button wpqa-question"><i class="icon-pencil"></i></a> <script type="text/javascript" src="https://askthedev.com/wp-content/plugins/WPQA/assets/js/scripts.js?ver=6.1.4" id="wpqa-scripts-js-js"></script> <script type="text/javascript" src="https://askthedev.com/wp-includes/js/jquery/ui/core.min.js?ver=1.13.3" id="jquery-ui-core-js"></script> <script type="text/javascript" src="https://askthedev.com/wp-includes/js/jquery/ui/datepicker.min.js?ver=1.13.3" id="jquery-ui-datepicker-js"></script> <script type="text/javascript" id="jquery-ui-datepicker-js-after"> /* <![CDATA[ */ jQuery(function(jQuery){jQuery.datepicker.setDefaults({"closeText":"Close","currentText":"Today","monthNames":["January","February","March","April","May","June","July","August","September","October","November","December"],"monthNamesShort":["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"],"nextText":"Next","prevText":"Previous","dayNames":["Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday"],"dayNamesShort":["Sun","Mon","Tue","Wed","Thu","Fri","Sat"],"dayNamesMin":["S","M","T","W","T","F","S"],"dateFormat":"MM d, yy","firstDay":1,"isRTL":false});}); /* ]]> */ </script> <script type="text/javascript" src="https://askthedev.com/wp-includes/js/jquery/ui/mouse.min.js?ver=1.13.3" id="jquery-ui-mouse-js"></script> <script type="text/javascript" src="https://askthedev.com/wp-includes/js/jquery/ui/sortable.min.js?ver=1.13.3" id="jquery-ui-sortable-js"></script> <script type="text/javascript" id="wpqa-custom-js-js-extra"> /* <![CDATA[ */ var wpqa_custom = {"admin_url":"https:\/\/askthedev.com\/wp-admin\/admin-ajax.php","poll_image_title":"0","comment_limit":"0","comment_min_limit":"0","answer_limit":"0","answer_min_limit":"0","question":"question","asked_question":"asked-question","home_url":"https:\/\/askthedev.com\/","poll_number_min":"Sorry, The minimum items is","poll_number_max":"Sorry, The maximum items is","wpqa_error_text":"Please fill the required field.","wpqa_error_min_limit":"Sorry, The minimum characters is","wpqa_error_limit":"Sorry, The maximum characters is","sure_delete_comment":"Are you sure you want to delete the comment?","sure_delete_answer":"Are you sure you want to delete the answer?","wpqa_remove_image":"Are you sure you want to delete the image?","wpqa_remove_attachment":"Are you sure you want to delete the attachment?","no_vote_question":"Sorry, you cannot vote your question.","no_vote_more":"Sorry, you cannot vote on the same question more than once.","no_vote_user":"Voting is available to members only.","no_vote_answer":"Sorry, you cannot vote your answer.","no_vote_more_answer":"Sorry, you cannot vote on the same answer more than once.","no_vote_comment":"Sorry, you cannot vote your comment.","no_vote_more_comment":"Sorry, you cannot vote on the same comment more than once.","follow_question_attr":"Follow the question","unfollow_question_attr":"Unfollow the question","follow":"Follow","unfollow":"Unfollow","select_file":"Select file","browse":"Browse","reported":"Thank you, your report will be reviewed shortly.","wpqa_error_comment":"Please type a comment.","click_continue":"Click here to continue.","click_not_finish":"Complete your following above to continue.","ban_user":"Ban user","unban_user":"Unban user","block_user":"Block user","unblock_user":"Unblock user","no_poll_more":"Sorry, you cannot poll on the same question more than once.","must_login":"Please login to vote and see the results.","insert_image":"Insert Image","error_uploading_image":"Attachment Error! Please upload image only.","add_favorite":"Add this question to favorites","remove_favorite":"Remove this question of my favorites","add_emoji":"React"}; /* ]]> */ </script> <script type="text/javascript" src="https://askthedev.com/wp-content/plugins/WPQA/assets/js/custom.js?ver=6.1.4" id="wpqa-custom-js-js"></script> <script type="text/javascript" id="wpqa-single-js-js-extra"> /* <![CDATA[ */ var wpqa_single = {"wpqa_dir":"https:\/\/askthedev.com\/wp-content\/plugins\/WPQA\/","wpqa_best_answer_nonce":"4ab32fc7ea","require_name_email":"require_name_email","admin_url":"https:\/\/askthedev.com\/wp-admin\/admin-ajax.php","comment_limit":"0","comment_min_limit":"0","answer_limit":"0","answer_min_limit":"0","captcha_answer":"Cairo","attachment_answer":"0","featured_image_answer":"0","terms_active_comment":"0","comment_editor":"0","activate_editor_reply":"0","allow_to_reply":"1","allow_to_answer":"1","is_logged":"unlogged","display_name":"","profile_url":"","logout_url":"","popup_share_seconds":"30","comment_action":"https:\/\/askthedev.com\/wp-comments-post.php","wpqa_error_name":"Please fill the required fields (name).","wpqa_error_email":"Please fill the required fields (email).","wpqa_valid_email":"Please enter a valid email address.","wpqa_error_comment":"Please type a comment.","wpqa_error_min_limit":"Sorry, The minimum characters is","wpqa_error_limit":"Sorry, The maximum characters is","wpqa_error_terms":"There are required fields (Agree of the terms).","cancel_reply":"Cancel reply.","logged_as":"Logged in as","logout_title":"Log out of this account","logout":"Log out","reply":"Reply","submit":"Submit","choose_best_answer":"Select as best answer","cancel_best_answer":"Cancel the best answer","best_answer":"Best answer","best_answer_selected":"There is another one select this a best answer","wpqa_error_captcha":"The captcha is incorrect, Please try again.","sure_delete":"Are you sure you want to delete the question?","sure_delete_post":"Are you sure you want to delete the post?","get_points":"You have bumped your question."}; /* ]]> */ </script> <script type="text/javascript" src="https://askthedev.com/wp-content/plugins/WPQA/assets/js/single.js?ver=6.1.4" id="wpqa-single-js-js"></script> <script type="text/javascript" id="wpqa-unlogged-js-js-extra"> /* <![CDATA[ */ var wpqa_unlogged = {"wpqa_dir":"https:\/\/askthedev.com\/wp-content\/plugins\/WPQA\/","admin_url":"https:\/\/askthedev.com\/wp-admin\/admin-ajax.php","captcha_answer":"Cairo","wpqa_error_text":"Please fill the required field.","wpqa_error_captcha":"The captcha is incorrect, Please try again."}; /* ]]> */ </script> <script type="text/javascript" src="https://askthedev.com/wp-content/plugins/WPQA/assets/js/unlogged.js?ver=6.1.4" id="wpqa-unlogged-js-js"></script> <script type="text/javascript" src="https://askthedev.com/wp-includes/js/dist/hooks.min.js?ver=4d63a3d491d11ffd8ac6" id="wp-hooks-js"></script> <script type="text/javascript" src="https://askthedev.com/wp-includes/js/dist/i18n.min.js?ver=5e580eb46a90c2b997e6" id="wp-i18n-js"></script> <script type="text/javascript" id="wp-i18n-js-after"> /* <![CDATA[ */ wp.i18n.setLocaleData( { 'text direction\u0004ltr': [ 'ltr' ] } ); /* ]]> */ </script> <script type="text/javascript" src="https://askthedev.com/wp-content/plugins/contact-form-7/includes/swv/js/index.js?ver=6.1" id="swv-js"></script> <script type="text/javascript" id="contact-form-7-js-before"> /* <![CDATA[ */ var wpcf7 = { "api": { "root": "https:\/\/askthedev.com\/wp-json\/", "namespace": "contact-form-7\/v1" }, "cached": 1 }; /* ]]> */ </script> <script type="text/javascript" src="https://askthedev.com/wp-content/plugins/contact-form-7/includes/js/index.js?ver=6.1" id="contact-form-7-js"></script> <script type="text/javascript" src="https://askthedev.com/wp-content/themes/discy/js/html5.js?ver=1.0.0" id="html5-js"></script> <script type="text/javascript" src="https://askthedev.com/wp-content/themes/discy/js/modernizr.js?ver=1.0.0" id="modernizr-js"></script> <script type="text/javascript" src="https://askthedev.com/wp-content/themes/discy/js/flexMenu.js?ver=1.0.0" id="discy-flex-menu-js"></script> <script type="text/javascript" src="https://askthedev.com/wp-content/themes/discy/js/scrollbar.js?ver=1.0.0" id="discy-scrollbar-js"></script> <script type="text/javascript" src="https://askthedev.com/wp-content/themes/discy/js/theia.js?ver=1.0.0" id="discy-theia-js"></script> <script type="text/javascript" src="https://askthedev.com/wp-content/themes/discy/js/owl.js?ver=1.0.0" id="discy-owl-js"></script> <script type="text/javascript" src="https://askthedev.com/wp-content/themes/discy/js/matchHeight.js?ver=1.0.0" id="discy-match-height-js"></script> <script type="text/javascript" src="https://askthedev.com/wp-content/themes/discy/js/prettyPhoto.js?ver=1.0.0" id="discy-pretty-photo-js"></script> <script type="text/javascript" src="https://askthedev.com/wp-content/themes/discy/js/tabs.js?ver=1.0.0" id="discy-tabs-js"></script> <script type="text/javascript" src="https://askthedev.com/wp-content/themes/discy/js/tipsy.js?ver=1.0.0" id="discy-tipsy-js"></script> <script type="text/javascript" src="https://askthedev.com/wp-content/themes/discy/js/isotope.js?ver=1.0.0" id="discy-isotope-js"></script> <script type="text/javascript" src="https://askthedev.com/wp-includes/js/imagesloaded.min.js?ver=5.0.0" id="imagesloaded-js"></script> <script type="text/javascript" src="https://askthedev.com/wp-content/themes/discy/js/custom.js?ver=5.7.4" id="discy-custom-js-js"></script> <script type="text/javascript" src="https://askthedev.com/wp-includes/js/comment-reply.min.js?ver=6.7.2" id="comment-reply-js" async="async" data-wp-strategy="async"></script> <script type="text/javascript" src="https://askthedev.com/wp-content/plugins/highlighting-code-block/assets/js/prism.js?ver=2.0.1" id="hcb-prism-js"></script> <script type="text/javascript" src="https://askthedev.com/wp-includes/js/clipboard.min.js?ver=2.0.11" id="clipboard-js"></script> <script type="text/javascript" id="hcb-script-js-extra"> /* <![CDATA[ */ var hcbVars = {"showCopyBtn":"1","copyBtnLabel":"Copy code to clipboard"}; /* ]]> */ </script> <script type="text/javascript" src="https://askthedev.com/wp-content/plugins/highlighting-code-block/build/js/hcb_script.js?ver=2.0.1" id="hcb-script-js"></script> <script type="text/javascript">(function (undefined) {let scriptOptions={"_localizedStrings":{"redirect_overlay_title":"Hold On","redirect_overlay_text":"You are being redirected to another page,<br>it may take a few seconds.","webview_notification_text":"The selected provider doesn't support embedded browsers!"},"_targetWindow":"prefer-popup","_redirectOverlay":"overlay-with-spinner-and-message","_unsupportedWebviewBehavior":""}; /** * Used when Cross-Origin-Opener-Policy blocked the access to the opener. We can't have a reference of the opened windows, so we should attempt to refresh only the windows that has opened popups. */ window._nslHasOpenedPopup = false; window._nslWebViewNoticeElement = null; window.NSLPopup = function (url, title, w, h) { /** * Cross-Origin-Opener-Policy blocked the access to the opener */ if (typeof BroadcastChannel === "function") { const _nslLoginBroadCastChannel = new BroadcastChannel('nsl_login_broadcast_channel'); _nslLoginBroadCastChannel.onmessage = (event) => { if (window?._nslHasOpenedPopup && event.data?.action === 'redirect') { window._nslHasOpenedPopup = false; const url = event.data?.href; _nslLoginBroadCastChannel.close(); if (typeof window.nslRedirect === 'function') { window.nslRedirect(url); } else { window.opener.location = url; } } }; } const userAgent = navigator.userAgent, mobile = function () { return /\b(iPhone|iP[ao]d)/.test(userAgent) || /\b(iP[ao]d)/.test(userAgent) || /Android/i.test(userAgent) || /Mobile/i.test(userAgent); }, screenX = window.screenX !== undefined ? window.screenX : window.screenLeft, screenY = window.screenY !== undefined ? window.screenY : window.screenTop, outerWidth = window.outerWidth !== undefined ? window.outerWidth : document.documentElement.clientWidth, outerHeight = window.outerHeight !== undefined ? window.outerHeight : document.documentElement.clientHeight - 22, targetWidth = mobile() ? null : w, targetHeight = mobile() ? null : h, left = parseInt(screenX + (outerWidth - targetWidth) / 2, 10), right = parseInt(screenY + (outerHeight - targetHeight) / 2.5, 10), features = []; if (targetWidth !== null) { features.push('width=' + targetWidth); } if (targetHeight !== null) { features.push('height=' + targetHeight); } features.push('left=' + left); features.push('top=' + right); features.push('scrollbars=1'); const newWindow = window.open(url, title, features.join(',')); if (window.focus) { newWindow.focus(); } window._nslHasOpenedPopup = true; return newWindow; }; let isWebView = null; function checkWebView() { if (isWebView === null) { function _detectOS(ua) { if (/Android/.test(ua)) { return "Android"; } else if (/iPhone|iPad|iPod/.test(ua)) { return "iOS"; } else if (/Windows/.test(ua)) { return "Windows"; } else if (/Mac OS X/.test(ua)) { return "Mac"; } else if (/CrOS/.test(ua)) { return "Chrome OS"; } else if (/Firefox/.test(ua)) { return "Firefox OS"; } return ""; } function _detectBrowser(ua) { let android = /Android/.test(ua); if (/Opera Mini/.test(ua) || / OPR/.test(ua) || / OPT/.test(ua)) { return "Opera"; } else if (/CriOS/.test(ua)) { return "Chrome for iOS"; } else if (/Edge/.test(ua)) { return "Edge"; } else if (android && /Silk\//.test(ua)) { return "Silk"; } else if (/Chrome/.test(ua)) { return "Chrome"; } else if (/Firefox/.test(ua)) { return "Firefox"; } else if (android) { return "AOSP"; } else if (/MSIE|Trident/.test(ua)) { return "IE"; } else if (/Safari\//.test(ua)) { return "Safari"; } else if (/AppleWebKit/.test(ua)) { return "WebKit"; } return ""; } function _detectBrowserVersion(ua, browser) { if (browser === "Opera") { return /Opera Mini/.test(ua) ? _getVersion(ua, "Opera Mini/") : / OPR/.test(ua) ? _getVersion(ua, " OPR/") : _getVersion(ua, " OPT/"); } else if (browser === "Chrome for iOS") { return _getVersion(ua, "CriOS/"); } else if (browser === "Edge") { return _getVersion(ua, "Edge/"); } else if (browser === "Chrome") { return _getVersion(ua, "Chrome/"); } else if (browser === "Firefox") { return _getVersion(ua, "Firefox/"); } else if (browser === "Silk") { return _getVersion(ua, "Silk/"); } else if (browser === "AOSP") { return _getVersion(ua, "Version/"); } else if (browser === "IE") { return /IEMobile/.test(ua) ? _getVersion(ua, "IEMobile/") : /MSIE/.test(ua) ? _getVersion(ua, "MSIE ") : _getVersion(ua, "rv:"); } else if (browser === "Safari") { return _getVersion(ua, "Version/"); } else if (browser === "WebKit") { return _getVersion(ua, "WebKit/"); } return "0.0.0"; } function _getVersion(ua, token) { try { return _normalizeSemverString(ua.split(token)[1].trim().split(/[^\w\.]/)[0]); } catch (o_O) { } return "0.0.0"; } function _normalizeSemverString(version) { const ary = version.split(/[\._]/); return (parseInt(ary[0], 10) || 0) + "." + (parseInt(ary[1], 10) || 0) + "." + (parseInt(ary[2], 10) || 0); } function _isWebView(ua, os, browser, version, options) { switch (os + browser) { case "iOSSafari": return false; case "iOSWebKit": return _isWebView_iOS(options); case "AndroidAOSP": return false; case "AndroidChrome": return parseFloat(version) >= 42 ? /; wv/.test(ua) : /\d{2}\.0\.0/.test(version) ? true : _isWebView_Android(options); } return false; } function _isWebView_iOS(options) { const document = (window["document"] || {}); if ("WEB_VIEW" in options) { return options["WEB_VIEW"]; } return !("fullscreenEnabled" in document || "webkitFullscreenEnabled" in document || false); } function _isWebView_Android(options) { if ("WEB_VIEW" in options) { return options["WEB_VIEW"]; } return !("requestFileSystem" in window || "webkitRequestFileSystem" in window || false); } const options = {}, nav = window.navigator || {}, ua = nav.userAgent || "", os = _detectOS(ua), browser = _detectBrowser(ua), browserVersion = _detectBrowserVersion(ua, browser); isWebView = _isWebView(ua, os, browser, browserVersion, options); } return isWebView; } function isAllowedWebViewForUserAgent(provider) { const facebookAllowedWebViews = [ 'Instagram', 'FBAV', 'FBAN' ]; let whitelist = []; if (provider && provider === 'facebook') { whitelist = facebookAllowedWebViews; } const nav = window.navigator || {}, ua = nav.userAgent || ""; if (whitelist.length && ua.match(new RegExp(whitelist.join('|')))) { return true; } return false; } function disableButtonInWebView(providerButtonElement) { if (providerButtonElement) { providerButtonElement.classList.add('nsl-disabled-provider'); providerButtonElement.setAttribute('href', '#'); providerButtonElement.addEventListener('pointerdown', (e) => { if (!window._nslWebViewNoticeElement) { window._nslWebViewNoticeElement = document.createElement('div'); window._nslWebViewNoticeElement.id = "nsl-notices-fallback"; window._nslWebViewNoticeElement.addEventListener('pointerdown', function (e) { this.parentNode.removeChild(this); window._nslWebViewNoticeElement = null; }); const webviewNoticeHTML = '<div class="error"><p>' + scriptOptions._localizedStrings.webview_notification_text + '</p></div>'; window._nslWebViewNoticeElement.insertAdjacentHTML("afterbegin", webviewNoticeHTML); document.body.appendChild(window._nslWebViewNoticeElement); } }); } } window._nslDOMReady(function () { window.nslRedirect = function (url) { if (scriptOptions._redirectOverlay) { const overlay = document.createElement('div'); overlay.id = "nsl-redirect-overlay"; let overlayHTML = ''; const overlayContainer = "<div id='nsl-redirect-overlay-container'>", overlayContainerClose = "</div>", overlaySpinner = "<div id='nsl-redirect-overlay-spinner'></div>", overlayTitle = "<p id='nsl-redirect-overlay-title'>" + scriptOptions._localizedStrings.redirect_overlay_title + "</p>", overlayText = "<p id='nsl-redirect-overlay-text'>" + scriptOptions._localizedStrings.redirect_overlay_text + "</p>"; switch (scriptOptions._redirectOverlay) { case "overlay-only": break; case "overlay-with-spinner": overlayHTML = overlayContainer + overlaySpinner + overlayContainerClose; break; default: overlayHTML = overlayContainer + overlaySpinner + overlayTitle + overlayText + overlayContainerClose; break; } overlay.insertAdjacentHTML("afterbegin", overlayHTML); document.body.appendChild(overlay); } window.location = url; }; let targetWindow = scriptOptions._targetWindow || 'prefer-popup', lastPopup = false; document.addEventListener('click', function (e) { if (e.target) { const buttonLinkElement = e.target.closest('a[data-plugin="nsl"][data-action="connect"]') || e.target.closest('a[data-plugin="nsl"][data-action="link"]'); if (buttonLinkElement) { if (lastPopup && !lastPopup.closed) { e.preventDefault(); lastPopup.focus(); } else { let href = buttonLinkElement.href, success = false; if (href.indexOf('?') !== -1) { href += '&'; } else { href += '?'; } const redirectTo = buttonLinkElement.dataset.redirect; if (redirectTo === 'current') { href += 'redirect=' + encodeURIComponent(window.location.href) + '&'; } else if (redirectTo && redirectTo !== '') { href += 'redirect=' + encodeURIComponent(redirectTo) + '&'; } if (targetWindow !== 'prefer-same-window' && checkWebView()) { targetWindow = 'prefer-same-window'; } if (targetWindow === 'prefer-popup') { lastPopup = NSLPopup(href + 'display=popup', 'nsl-social-connect', buttonLinkElement.dataset.popupwidth, buttonLinkElement.dataset.popupheight); if (lastPopup) { success = true; e.preventDefault(); } } else if (targetWindow === 'prefer-new-tab') { const newTab = window.open(href + 'display=popup', '_blank'); if (newTab) { if (window.focus) { newTab.focus(); } success = true; window._nslHasOpenedPopup = true; e.preventDefault(); } } if (!success) { window.location = href; e.preventDefault(); } } } } }); let buttonCountChanged = false; const googleLoginButtons = document.querySelectorAll(' a[data-plugin="nsl"][data-provider="google"]'); if (googleLoginButtons.length && checkWebView()) { googleLoginButtons.forEach(function (googleLoginButton) { if (scriptOptions._unsupportedWebviewBehavior === 'disable-button') { disableButtonInWebView(googleLoginButton); } else { googleLoginButton.remove(); buttonCountChanged = true; } }); } const facebookLoginButtons = document.querySelectorAll(' a[data-plugin="nsl"][data-provider="facebook"]'); if (facebookLoginButtons.length && checkWebView() && /Android/.test(window.navigator.userAgent) && !isAllowedWebViewForUserAgent('facebook')) { facebookLoginButtons.forEach(function (facebookLoginButton) { if (scriptOptions._unsupportedWebviewBehavior === 'disable-button') { disableButtonInWebView(facebookLoginButton); } else { facebookLoginButton.remove(); buttonCountChanged = true; } }); } const separators = document.querySelectorAll('div.nsl-separator'); if (buttonCountChanged && separators.length) { separators.forEach(function (separator) { const separatorParentNode = separator.parentNode; if (separatorParentNode) { const separatorButtonContainer = separatorParentNode.querySelector('div.nsl-container-buttons'); if (separatorButtonContainer && !separatorButtonContainer.hasChildNodes()) { separator.remove(); } } }) } });})();</script></body> </html>

askthedev.com Latest Articles

I. Introduction