Front End Technology Articles

Page 410 of 652

How to sort array by first item in subarray - JavaScript?

AmitDiwan
AmitDiwan
Updated on 09-Nov-2020 572 Views

Let’s say we have the following array −var studentDetails = [    [89, "John"],    [78, "John"],    [94, "John"],    [47, "John"],    [33, "John"] ];And we need to sort the array on the basis of the first item i.e. 89, 78, 94, etc. For this, use sort().ExampleFollowing is the code −var studentDetails =    [       [89, "John"],       [78, "John"],       [94, "John"],       [47, "John"],       [33, "John"]    ]; studentDetails.sort((first, second) => second[0] - first[0]) console.log(studentDetails);To run the above program, you need to use the ...

Read More

How to remove duplicate property values in array – JavaScript?

AmitDiwan
AmitDiwan
Updated on 09-Nov-2020 850 Views

Let’s say the following is our array −var details = [    {       studentName: "John",       studentMarks: [78, 98]    },    {       studentName: "David",       studentMarks: [87, 87]    },    {       studentName: "Bob",       studentMarks: [48, 58]    },    {       studentName: "Sam",       studentMarks: [98, 98]    }, ]We need to remove the duplicate property value i.e. 87 is repeating above. We need to remove it.For this, use the concept of map().ExampleFollowing is the code −var details ...

Read More

Trigger an event IMMEDIATELY on mouse click, not after I let go of the mouse - JavaScript?

AmitDiwan
AmitDiwan
Updated on 09-Nov-2020 323 Views

For this, use the addEventListener() with mousedown event.ExampleFollowing is the code −            Document    document.addEventListener("mousedown", function () {       console.log("Mouse down event is happening");    }); To run the above program, save the file name “anyName.html(index.html)”. Right click on the file and select the option “Open with Live Server” in VS Code editor.OutputThis will produce the following output on console −When you click the mouse, the event will generate. The console output is shown below −

Read More

Add time to string data/time - JavaScript?

AmitDiwan
AmitDiwan
Updated on 09-Nov-2020 1K+ Views

At first, set a new Date in JavaScript −var dateValue = new Date("2021-01-12 10:10:20");Use new Date() along with setHours() and getHours() to add time.ExampleFollowing is the code −var dateValue = new Date("2021-01-12 10:10:20"); dateValue.setHours(dateValue.getHours() + 2); console.log("The date value is=" + dateValue.toString()); console.log("Only Hours value after incrementing=" + dateValue.getHours());To run the above program, you need to use the following command −node fileName.js. Here, my file name is demo291.js.OutputThis will produce the following output on console −PS C:\Users\Amit\javascript-code> node demo291.js The date value is=Tue Jan 12 2021 12:10:20 GMT+0530 (India Standard Time) Only Hours value after incrementing=12

Read More

How to generate array key using array index – JavaScript associative array?

AmitDiwan
AmitDiwan
Updated on 09-Nov-2020 369 Views

For this, use forEach() along with [] to an associative array.ExampleFollowing is the code −var result = {}; var names = ['John', 'David', 'Mike', 'Sam', 'Bob', 'Adam']; names.forEach((nameObject, counter) => {    var generatedValues = { [nameObject]: counter };    Object.assign(result, generatedValues) }) console.log(result);To run the above program, you need to use the following command −node fileName.js.Here, my file name is demo290.js.OutputThis will produce the following output on console −PS C:\Users\Amit\javascript-code> node demo290.js { John: 0, David: 1, Mike: 2, Sam: 3, Bob: 4, Adam: 5 }

Read More

How to change the color of a button when the input field is filled – JavaScript?

AmitDiwan
AmitDiwan
Updated on 09-Nov-2020 2K+ Views

Let’s say the following is our button −Press MeOn filling the below input field, the color of the above button should change −ExampleFollowing is the code − Live Demo            Document           UserName:                Press Me    function changeTheColorOfButtonDemo() {       if (document.getElementById("changeColorDemo").value !== "") {          document.getElementById("buttonDemo").style.background = "green";       } else {          document.getElementById("buttonDemo").style.background = "skyblue";       }    } To run ...

Read More

Hide a video tag on a web page - JavaScript

AmitDiwan
AmitDiwan
Updated on 09-Nov-2020 4K+ Views

Let’s say we have the following sample video tag on a web page        You cannot play video here...... To hide a video on a web page, use yourVariableName.style.display=’none’.ExampleFollowing is the code −            Document    .hideVideo {       display: block;       z-index: 999;       margin-top: 10px;       margin-left: 10px;    }               You cannot play video here......        var hideVideo = document.getElementsByClassName("hideVideo")[0];    hideVideo.style.display = ...

Read More

Implement Bubble sort with negative and positive numbers – JavaScript?

AmitDiwan
AmitDiwan
Updated on 09-Nov-2020 957 Views

Let’s say the following is our unsorted array with negative and positive numbers −var arr = [10, -22, 54, 3, 4, 45, 6];ExampleFollowing is the code to implement Bubble Sort −function bubbleSort(numberArray, size) {    for (var lastIndex = size - 1; lastIndex > 0; lastIndex--) {       for (var i = 0; i < lastIndex; i++) {          if (numberArray[i] > numberArray[i + 1]) {             var temp = numberArray[i];             numberArray[i] = numberArray[i + 1];             numberArray[i + ...

Read More

What happens when length of object is set to 0 - JavaScript?

AmitDiwan
AmitDiwan
Updated on 09-Nov-2020 402 Views

Let’s say the following is our array object −var arrayObject =    [       "John",       "David",       "Mike"    ]You can use length property to set the length to 0 and clear memoryThe syntax is as follows to clear memory −yourArrayObjectName.length=0; // To clear memory yourArrayObjectName.length=4; // To allocate memoryOutputThis will produce the following output on console −var arrayObject =    [       "John",       "David",       "Mike"    ] arrayObject.length = 0; console.log(arrayObject); arrayObject.length = 5; for (var i = 0; i < arrayObject.length; i++)   ...

Read More

How to make a condition for event &#039;click&#039; inside/outside for multiple divs - JavaScript?

AmitDiwan
AmitDiwan
Updated on 09-Nov-2020 1K+ Views

You can use event listeners for clicks.ExampleFollowing is the code − Live Demo            Document           First Division               Second Division      document.addEventListener('click', callEventFuncion)    function callEventFuncion(event) {       var div = document.querySelectorAll('.divDemo');       var titleResult = document.querySelectorAll('.my-title');       var result = Array.apply(0, div).find((v) => v.contains(event.target));       if (result) {          console.log(" Incrementing Division Selection");       }       else { ...

Read More
Showing 4091–4100 of 6,517 articles
« Prev 1 408 409 410 411 412 652 Next »
Advertisements