Skip to content
geeksforgeeks
  • Tutorials
    • Python
    • Java
    • Data Structures & Algorithms
    • ML & Data Science
    • Interview Corner
    • Programming Languages
    • Web Development
    • CS Subjects
    • DevOps And Linux
    • Software and Tools
    • School Learning
    • Practice Coding Problems
  • Go Premium
  • JS Tutorial
  • JS Exercise
  • JS Interview Questions
  • JS Array
  • JS String
  • JS Object
  • JS Operator
  • JS Date
  • JS Error
  • JS Projects
  • JS Set
  • JS Map
  • JS RegExp
  • JS Math
  • JS Number
  • JS Boolean
  • JS Examples
  • JS Free JS Course
  • JS A to Z Guide
  • JS Formatter
Open In App
Next Article:
What is Scripted Testing?
Next article icon

What is Scripting ?

Last Updated : 31 Jul, 2024
Comments
Improve
Suggest changes
Like Article
Like
Report

Scripting is used to automate tasks on a website. It can respond to any specific event, like button clicks, scrolling, and form submission. It can also be used to generate dynamic content. and JavaScript is a widely used scripting language. In this article, we will learn about types of scripting, their features, benefits, applications, and steps to use them.

Table of Content

  • Types of scripting
  • Features of Browser Scripting
  • Benefits of Browser Scripting
  • Application of Scripting
  • Steps to use Scripting
  • Example
  • Conclusion

Types of scripting

There are two types of scripting:

  1. Client-side scripting (browser scripting)
  2. Server-Side Scripting

1. Client-side scripting (Browser Scripting)

Client-side scripting refers to the scripts that run on the user's web browser. and JavaScript is the most common language for scripting. It is mostly supported by all browsers, and it allows dynamic scripting. It can handle user interactions like button clicks, hovers, and form submissions, and it can also reduce the load on the server as processing happens on the client side. By using client-side scripting, you can also validate the form field, access the DOM, and manipulate it to dynamically change its content.

2. Server-side scripting

Server-side scripting refers to scripts that run on the web server. and languages such as PHP, Python, Java, and Node. JS is used for server-side scripting. In server-side scripting, the script is executed before it is sent to the browser. It can handle tasks that require a database, file system, and any other server resources securely. It creates dynamic content based on user requests. You can also create an API by using server-side scripting.

Features of Browser Scripting

  • By using Document Object Model (DOM) you can dynamically change the content of a web page.
  • Event Handling allows you to respond to events like button clicks, form submitting, etc..
  • By using Asynchronous JavaScript XM (AJAX) you can dynamically change the content without reloading the page.
  • It supports client-side storage like cookies and local storage.

Benefits of Browser Scripting

  • It is supported by every browser.
  • You can automate tasks like form filling, Data extraction, etc.
  • By using AJAX you can dynamically display content without reloading to web page.
  • It allows access to browser storage like local storage and cookies.
  • You can respond to any event.
  • By using DOM you can Dynamically change the content and structure of a web page.

Application of Scripting

  • It can be used with other Languages.
  • You can make an HTTP request to the server.
  • You can automate tasks.
  • It can be used to access DOM and dynamically change content.
  • It provides a storage facility.
  • You can respond to any specific events like button click, scroll, etc.
  • It can be used to extract data from server response.

Steps to use Scripting

  1. Choose a Scripting Language. Ex, JavaScript
  2. Use any code editor for writing your script. Ex, Notepad, VS Code, Sublime Text etc..
  3. Learn How to manipulate a DOM and Event Handling.
  4. Run your Script on Any Browser.

Example

In this example we are change the text GeeksForGeeks on calling a function by button click event. and after 2 second it is alerting a message.

HTML
<!DOCTYPE html>
<html lang="en">
  
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>GeeksForGeeks</title>
</head>
  
<body>
    <h1>GeeksForGeeks | Browser Scripting</h1>
    <button onclick="showtext()">Say Hello</button>
    <h2 id="text">GeeksForGeeks</h2>

    <!-- Script tag is used to write Script  -->
    <script>
        // JavaScript code starts here
        // This Function is called when you click on "Say Hello" button.
        const showtext = () => {
            // Get the element with the id 'text'
            let text = document.getElementById('text')
            
            // Change the text content of the 'text' element
            text.innerText = "Hello"

            // Set a timeout to display an alert after 2 seconds
            setTimeout(() => {
                alert("Text has been changed")
            }, 2000)
        } 
    </script>
</body>
  
</html>

Output

Conclusion

Scripting plays an vital role to guiding browser on how to respond to events. And JavaScript is the popular and broadly used language for scripting. By using scripting you can dynamically change content by using DOM, event handling and AJAX.


Next Article
What is Scripted Testing?

J

jaimin78
Improve
Article Tags :
  • JavaScript
  • Geeks Premier League 2023

Similar Reads

    What is Scripted Testing?
    Testing practices and their related approaches can be divided into different forms according to needs and specific contexts. Among these, scripted testing is one of the common testing methodologies that is used by most organizations. This article focuses on scripted testing, when and where it is use
    7 min read
    What are Scripting Languages?
    All the scripting languages are programming languages. It is a type of programming language in which there is no compilation and the execution takes place line by line. Generally, a programming language would be first compiled and then executed, but in a scripting language, the program will be execu
    5 min read
    What is Malicious Script
    Malicious scripts are small pieces of malicious code that hackers secretly inject into legitimate websites, applications, or even ads. They may appear to be part of an ordinary webpage but quietly operate in the background to steal confidential information, redirect users to imposter pages, or insta
    6 min read
    What is ScriptManagerProxy Control ?
    Creating interactive and dynamic web applications in the field of web development sometimes entails adding client-side scripting languages such as JavaScript. ScriptManagerProxy is a powerful tool provided by ASP.NET, a popular framework for developing web applications, that facilitates the manageme
    3 min read
    What is a Test Script in Software Testing?
    Active software projects are constantly changing - pages are being redesigned, user information is changing, and new functionality is being added. For it to work overtime, testers must make a constant effort to update the documents to match the new product. This can take a long time to test. Another
    7 min read
    JavaScript String Exercise
    JavaScript string is a primitive data type and is used for storing and manipulating a sequence of characters. It can contain zero or more characters within single or double quotes. This article contains a wide collection of JavaScript Programming examples based on String. JavaScriptlet s = "Geeksfor
    7 min read
`; $(commentSectionTemplate).insertBefore(".article--recommended"); } loadComments(); }); }); function loadComments() { if ($("iframe[id*='discuss-iframe']").length top_of_element && top_of_screen articleRecommendedTop && top_of_screen articleRecommendedBottom)) { if (!isfollowingApiCall) { isfollowingApiCall = true; setTimeout(function(){ if (loginData && loginData.isLoggedIn) { if (loginData.userName !== $('#followAuthor').val()) { is_following(); } else { $('.profileCard-profile-picture').css('background-color', '#E7E7E7'); } } else { $('.follow-btn').removeClass('hideIt'); } }, 3000); } } }); } $(".accordion-header").click(function() { var arrowIcon = $(this).find('.bottom-arrow-icon'); arrowIcon.toggleClass('rotate180'); }); }); window.isReportArticle = false; function report_article(){ if (!loginData || !loginData.isLoggedIn) { const loginModalButton = $('.login-modal-btn') if (loginModalButton.length) { loginModalButton.click(); } return; } if(!window.isReportArticle){ //to add loader $('.report-loader').addClass('spinner'); jQuery('#report_modal_content').load(gfgSiteUrl+'wp-content/themes/iconic-one/report-modal.php', { PRACTICE_API_URL: practiceAPIURL, PRACTICE_URL:practiceURL },function(responseTxt, statusTxt, xhr){ if(statusTxt == "error"){ alert("Error: " + xhr.status + ": " + xhr.statusText); } }); }else{ window.scrollTo({ top: 0, behavior: 'smooth' }); $("#report_modal_content").show(); } } function closeShareModal() { const shareOption = document.querySelector('[data-gfg-action="share-article"]'); shareOption.classList.remove("hover_share_menu"); let shareModal = document.querySelector(".hover__share-modal-container"); shareModal && shareModal.remove(); } function openShareModal() { closeShareModal(); // Remove existing modal if any let shareModal = document.querySelector(".three_dot_dropdown_share"); shareModal.appendChild(Object.assign(document.createElement("div"), { className: "hover__share-modal-container" })); document.querySelector(".hover__share-modal-container").append( Object.assign(document.createElement('div'), { className: "share__modal" }), ); document.querySelector(".share__modal").append(Object.assign(document.createElement('h1'), { className: "share__modal-heading" }, { textContent: "Share to" })); const socialOptions = ["LinkedIn", "WhatsApp","Twitter", "Copy Link"]; socialOptions.forEach((socialOption) => { const socialContainer = Object.assign(document.createElement('div'), { className: "social__container" }); const icon = Object.assign(document.createElement("div"), { className: `share__icon share__${socialOption.split(" ").join("")}-icon` }); const socialText = Object.assign(document.createElement("span"), { className: "share__option-text" }, { textContent: `${socialOption}` }); const shareLink = (socialOption === "Copy Link") ? Object.assign(document.createElement('div'), { role: "button", className: "link-container CopyLink" }) : Object.assign(document.createElement('a'), { className: "link-container" }); if (socialOption === "LinkedIn") { shareLink.setAttribute('href', `https://www.linkedin.com/sharing/share-offsite/?url=${window.location.href}`); shareLink.setAttribute('target', '_blank'); } if (socialOption === "WhatsApp") { shareLink.setAttribute('href', `https://api.whatsapp.com/send?text=${window.location.href}`); shareLink.setAttribute('target', "_blank"); } if (socialOption === "Twitter") { shareLink.setAttribute('href', `https://twitter.com/intent/tweet?url=${window.location.href}`); shareLink.setAttribute('target', "_blank"); } shareLink.append(icon, socialText); socialContainer.append(shareLink); document.querySelector(".share__modal").appendChild(socialContainer); //adding copy url functionality if(socialOption === "Copy Link") { shareLink.addEventListener("click", function() { var tempInput = document.createElement("input"); tempInput.value = window.location.href; document.body.appendChild(tempInput); tempInput.select(); tempInput.setSelectionRange(0, 99999); // For mobile devices document.execCommand('copy'); document.body.removeChild(tempInput); this.querySelector(".share__option-text").textContent = "Copied" }) } }); // document.querySelector(".hover__share-modal-container").addEventListener("mouseover", () => document.querySelector('[data-gfg-action="share-article"]').classList.add("hover_share_menu")); } function toggleLikeElementVisibility(selector, show) { document.querySelector(`.${selector}`).style.display = show ? "block" : "none"; } function closeKebabMenu(){ document.getElementById("myDropdown").classList.toggle("show"); }
geeksforgeeks-footer-logo
Corporate & Communications Address:
A-143, 7th Floor, Sovereign Corporate Tower, Sector- 136, Noida, Uttar Pradesh (201305)
Registered Address:
K 061, Tower K, Gulshan Vivante Apartment, Sector 137, Noida, Gautam Buddh Nagar, Uttar Pradesh, 201305
GFG App on Play Store GFG App on App Store
Advertise with us
  • Company
  • About Us
  • Legal
  • Privacy Policy
  • In Media
  • Contact Us
  • Advertise with us
  • GFG Corporate Solution
  • Placement Training Program
  • Languages
  • Python
  • Java
  • C++
  • PHP
  • GoLang
  • SQL
  • R Language
  • Android Tutorial
  • Tutorials Archive
  • DSA
  • DSA Tutorial
  • Basic DSA Problems
  • DSA Roadmap
  • Top 100 DSA Interview Problems
  • DSA Roadmap by Sandeep Jain
  • All Cheat Sheets
  • Data Science & ML
  • Data Science With Python
  • Data Science For Beginner
  • Machine Learning
  • ML Maths
  • Data Visualisation
  • Pandas
  • NumPy
  • NLP
  • Deep Learning
  • Web Technologies
  • HTML
  • CSS
  • JavaScript
  • TypeScript
  • ReactJS
  • NextJS
  • Bootstrap
  • Web Design
  • Python Tutorial
  • Python Programming Examples
  • Python Projects
  • Python Tkinter
  • Python Web Scraping
  • OpenCV Tutorial
  • Python Interview Question
  • Django
  • Computer Science
  • Operating Systems
  • Computer Network
  • Database Management System
  • Software Engineering
  • Digital Logic Design
  • Engineering Maths
  • Software Development
  • Software Testing
  • DevOps
  • Git
  • Linux
  • AWS
  • Docker
  • Kubernetes
  • Azure
  • GCP
  • DevOps Roadmap
  • System Design
  • High Level Design
  • Low Level Design
  • UML Diagrams
  • Interview Guide
  • Design Patterns
  • OOAD
  • System Design Bootcamp
  • Interview Questions
  • Inteview Preparation
  • Competitive Programming
  • Top DS or Algo for CP
  • Company-Wise Recruitment Process
  • Company-Wise Preparation
  • Aptitude Preparation
  • Puzzles
  • School Subjects
  • Mathematics
  • Physics
  • Chemistry
  • Biology
  • Social Science
  • English Grammar
  • Commerce
  • World GK
  • GeeksforGeeks Videos
  • DSA
  • Python
  • Java
  • C++
  • Web Development
  • Data Science
  • CS Subjects
@GeeksforGeeks, Sanchhaya Education Private Limited, All rights reserved
We use cookies to ensure you have the best browsing experience on our website. By using our site, you acknowledge that you have read and understood our Cookie Policy & Privacy Policy
Lightbox
Improvement
Suggest Changes
Help us improve. Share your suggestions to enhance the article. Contribute your expertise and make a difference in the GeeksforGeeks portal.
geeksforgeeks-suggest-icon
Create Improvement
Enhance the article with your expertise. Contribute to the GeeksforGeeks community and help create better learning resources for all.
geeksforgeeks-improvement-icon
Suggest Changes
min 4 words, max Words Limit:1000

Thank You!

Your suggestions are valuable to us.

What kind of Experience do you want to share?

Interview Experiences
Admission Experiences
Career Journeys
Work Experiences
Campus Experiences
Competitive Exam Experiences