Scribd
Upload
9 views4 pages

WAP To Changing The Content of Windows

The document contains multiple HTML and JavaScript code snippets demonstrating various programming concepts, including changing window content, event handling, array manipulation using the splice method, object creation with the new keyword, a simple calculator, and the use of getters and setters. It also explains the functionality of radio buttons in forms and includes validation for user selections. Each section provides examples and explanations of the code's purpose and output.

Uploaded by

nikamisha832
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
9 views4 pages

WAP To Changing The Content of Windows

The document contains multiple HTML and JavaScript code snippets demonstrating various programming concepts, including changing window content, event handling, array manipulation using the splice method, object creation with the new keyword, a simple calculator, and the use of getters and setters. It also explains the functionality of radio buttons in forms and includes validation for user selections. Each section provides examples and explanations of the code's purpose and output.

Uploaded by

nikamisha832
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 4

•WAP to changing the content of windows.

<html><head>

<title>Change Window Content</title>

</head><body>

<h1 id="title">Original Title</h1>

<p id="paragraph">Original paragraph content.</p>

<input type="button" value="Change Content" onclick="changeContent()">

<script>

function changeContent() {

document.getElementById('title').innerText = 'Updated Title';

document.getElementById('paragraph').innerText = 'Updated content.'; }

</script></body></html>

•WAP to demonstrate the use of onclick and onmousedownANS=

<html><head>

<title>Event Demonstration</title>

</head><body>

<input type="button" value="Click Me"

onclick="handleClick()"

onmousedown="handleMouseDown()">

<script>

function handleClick() {

document.write('<p>Button clicked!</p>'); }

function handleMouseDown() {

document.write('<p>Mouse button is down!</p>');

} </script> </body></html>

The `splice` method in JavaScript is used to add or remove items from an array.

ANS=Syntax: Array.splice(start, deleteCount, item1, item2, …)

- start: The index at which to start changing the array. If `start` is greater than the array length, itwill start at the end of the array. -
deleteCount : The number of elements to remove from the array. If omitted, all elements from`start` to the end of the array will be
removed. - `item1, item2, …`: Elements to add to the array, starting at the `start` index. If no elements areprovided, only elements will be
removed.Examples: 1. Removing Elements:

```javascript

Var fruits = [‘Apple’, ‘Banana’, ‘Cherry’, ‘Date’];

Fruits.splice(2, 1); // Removes 1 element at index 2

Document.write(fruits); // Output: [‘Apple’, ‘Banana’, ‘Date’]

Explanation: This removes the element `’Cherry’` from the array.

1. Adding Elements:= Var fruits = [‘Apple’, ‘Banana’, ‘Date’];

Fruits.splice(2, 0, ‘Cherry’, ‘Fig’); // Adds ‘Cherry’ and ‘Fig’ at index 2


Document.write(fruits); // Output: [‘Apple’, ‘Banana’, ‘Cherry’, ‘Fig’, ‘Date’]

Explanation: This adds `’Cherry’` and `’Fig’` without removing any elements.

2. Replacing Elements:= Var fruits = [Apple’, ‘Banana’, ‘Cherry’, ‘Date’];

Fruits.splice(1, 2, ‘Blueberry’, ‘Mango’); // Removes 2 elements at index 1 and adds 2 new

elements

Document.write(fruits); // Output: [‘Apple’, ‘Blueberry’, ‘Mango’, ‘Date’]

Explanation: This removes `’Banana’` and `’Cherry’`, and adds `’Blueberry’` and `’Mango’` in their Place.

Using "new" keyword:-==new keyword is used to create object.

Syntax: var objectname=new Object();

*Example:

var person = new Object(); person.firstName = "Swati"; person.lastName = "Jain"; person.age = 10;

Example <html> <body> <script>

var emp=new Object();

emp.id="CP-110";

emp.name="John Dias";

emp.salary=50000;

document.write(emp.id+" "+emp.name+" "+emp.salary);

</script>

</body>

</html> OUTPUT:- CP-110 John Dias 50000

Html addition substraction……ANS= <html> <body>


<h2>Simple Calculator</h2>
<input type="text" id="num1"
placeholder="Enter first number"><br><br>
<input type="text" id="num2"
placeholder="Enter second number"><br><br>
<input type="text" id="result"
placeholder="Result" readonly><br><br>
<input type="button" value="ADDITION"
onclick="calculate('add')">
<input type="button" value="SUBTRACTION"
onclick="calculate('subtract')">
<script> function calculate(operation) {
var num1 =parseFloat(document.getElementById('num1').
value);
var num2 =parseFloat(document.getElementById('num2'). value);
var result;
if (operation === 'add') {
result = num1 + num2;
} else if (operation === 'subtract') {
result = num1 - num2;} document.getElementById('result').value = result; }
</script> </body> </html>

•Getterand setter properties in javascript

<script>

Var person = 1

firstName: ‘Chirag’, lastName: ‘Shetty’.


Get fullName()

Return this firstName + + this.lastName;

Set fullName (name)

Var words = name.split(‘ ‘);

This.firstName = words[0];

This.firstName = words[0].toUpperCase();

This.lastName = words[1];

} Document.write(person.fullName); //Getters and setters allow you to get and set properties via methods.

Document.write(“<br>”+”before using set fullname()”+”<br>”);

Person.fullName = ‘Yash Desai’; //Set a property using set

Document.writeln(person.firstName); // Yash

Document.write(person.lastName); // Desai

</script>

Output: Chirag Shetty before using set fullname() YASH Desai

•The radiobutton allows the user to choose one of a predefined set of optionsANS= Define groups with the na property of the radio
buttons. Radio buttons with the same name belong to the same group. Radio buttons different names belongs to the different groups.
At most one radio button ca checked in group.

Syntax:

<input type=”radio” id=”male” name=”gender” value=”male”>

Code

<html> <body>

<form method=”post” action=” onsubmit=”retur ValidateForm();”>

<fieldset>

<legend>Select Course:</legend>

<input type=”radio” name=”br” value=”IT” checked>IT<br>

<input type=”radio” name=”br” value=”CO”>CO<br>

<input type=”radio” name=”br” value=”EJ”>EJ<br>

<br>

<input type=”submit” value=”Submit now”>

</fieldset>

</form>

<script type=”text/javascript”>

Function ValidateForm()

{Var obj = document.getElementsByName(“br”); for(var i=0; i<obj.length; i++)

If(obj[i].checked == true)

If(confirm(“You have selected” + obj[i].value))

Return true;

Else
Return false;

}</script>. </body>

You might also like