Questions tagged [dom]
The Document Object Model (DOM) is an application programming interface (API) for valid HTML and well-formed XML documents. It defines the logical structure of documents and the way a document is accessed and manipulated.
404
questions
0
votes
0
answers
32
views
Calendar Grid with layering of multiple events
My attempt at coding an adjusting calendar grid. It seems to work in most cases I've tried (although I haven't tested it exhaustively yet) but my DOM is a bit rusty and I wonder if there's better ways ...
- 469
1
vote
0
answers
61
views
DOM manipulating that I called Framework
I'm building a framework like this that can turn SASS-like code into CSS, a template engine like Mustache, a DOM manipulator like React, and a router to add a single page app, and I'm having a ...
1
vote
0
answers
43
views
Enable a textbox when the previous one is no longer empty
I've written this JavaScript code, which disables textboxes if the previous textbox is empty. This is so people enter the text in order — write first in the first textbox, only then the second textbox ...
2
votes
1
answer
713
views
jQuery code to add / remove classes depending on the button clicked
What the code does
What the JQuery code does is add / remove classes on div's elsewhere on the page, depending on the button clicked.
Button 1 clicked → add class ...
- 21
0
votes
1
answer
64
views
Wrting A Movie app , must be a better way
I am trying to get the value from the from and and pass it to the API and output the result to the DOM. The code works fine but I am 1000% sure there is a better way to write THIS. Thanks for the help ...
0
votes
1
answer
63
views
JS "Tabs" element
How can this be improved?
I'm looking particularly at the twice repeated tabButtons.forEach(button => {
...
- 1
4
votes
2
answers
1k
views
JavaScript front end for Odin Project book library database
I am currently working on The Odin Project and have reached the JavaScript Part. There is a project, to create a Website that serves a a library. You can add a book and it appears on the site as a ...
- 119
3
votes
1
answer
353
views
1
vote
1
answer
42
views
Refactored Todolist created using TS
After getting the code review I refactored the code and the updated version is below.
I tried implementing the suggestions but because I am still learning I might refactor again after learning how to ...
2
votes
1
answer
876
views
Animating GIF on hover in Javascript
I don't know JavaScript and it's safe to say this is my first code ever written in JS.
I just needed to animate my GIFs when user hovers over them only.
Googling separate concepts such as "string ...
- 1,568
2
votes
1
answer
122
views
Created a todo list in TS
I am learning Typescript and created a straightforward to-do list project to practice some basic concepts.
I am able to
Edit the todo
Delete the todo
Mark the todo as completed
I want to how can I ...
2
votes
2
answers
245
views
JavaScript code to check whether X won a tictactoe game
My code is already doing what I want, so it's functional, now my concern is, if there is a way to make it easier to read or even better and shorter my code, it's supposed to check if 3 'X' or 'O' are ...
- 21
0
votes
1
answer
345
views
Remove columns in HTML table where the sum is 0
I have an HTML table, and I would like to remove columns where the sum vertically is 0 dynamically.
...
- 459
1
vote
0
answers
23
views
Taildwindcss dark mode toggle using javascript object
I'm learning javascript objects and ES6 and made this dark mode toggle for TailwindCSS. I'd like to know what can I improve with this code below
...
- 45
4
votes
3
answers
2k
views
Increment counter on button click
I've written a simple JavaScript function to increment a counter after clicking on a button.
Here's my code:
...
- 171
0
votes
1
answer
59
views
Show/hide depending on ID and Class
I have written some code that shows a div class, based on what ID is clicked. I'm a beginner, so not sure how to make this code compact, it seems way too long at the moment. Can anyone suggest a ...
0
votes
1
answer
144
views
0
votes
1
answer
49
views
Replace the src of an image for each link in a nav menu
I have this giant wall of code, which replaces the src of an img on the page with the one specified, for each link in a nav menu.
But... it's a giant wall of code, calling up the action for each ...
2
votes
1
answer
178
views
Javascript function which polls an async endpoint and inserts the result in a web page
I read about debounce this morning and ended up needing something similar to the concept in real life this evening to build a poll that checks whether a link I receive from an async call is ready to ...
- 21
3
votes
0
answers
69
views
Command line notebook
I used Python and a little bit of JavaScript using the (Python) modules Dominate and Flask to create a web app that somewhat resembles the Jupyter Notebook though with very basic functionality. I ...
- 143
1
vote
0
answers
85
views
Changing game mode in Tic Tac Toe [The Odin Project] [closed]
I'm posting this here mostly as I posted it over at stackoverflow because the user that answered me recommended it:
I'm learning to code with The Odin Project. So far, I've been doing every project ...
- 11
0
votes
2
answers
2k
views
Sort table with ascending or descending order without a library
This is my first day coding, and I need help with sorting a table in ascending/descending order. The idea is that when a column is clicked it will sort in ascending order, and then it is clicked again ...
5
votes
3
answers
593
views
Refactor JavaScript nested if-else
I'm really new to code optimization and JS. I would like to ask for help on optimizing my code. Thank you in advance.
Here is my code:
...
- 69
-2
votes
1
answer
422
views
undefined instead of innerHTML [closed]
element.parentNode.parentNode.children[3].innerHTML is fine but not
...
7
votes
1
answer
370
views
Find and replace text in a webpage with JavaScript
I am new to web development and would like to get feedback on a JavaScript library that automatically finds and replaces text on a webpage using the MutationObserver interface.
EDIT: Seeing that this ...
- 73
1
vote
0
answers
944
views
Extract series of XML elements' values into an array
This code needs to extract data from in XML file.
Specifically it needs to iterate over it, looking for a node called CHARGE_CODES that repeats over and over and ...
- 11
1
vote
1
answer
48
views
How to keep current HtmlElement active and change its properties?
I have a simple class that listens click and draws two points on the page.
If first point is not exist it is drawn. When second point is present it should be changed after each click.
I dislike this ...
- 111
0
votes
1
answer
2k
views
Using <a> element instead of <tr> to get clickable rows
I want to create clickable rows in an html table. Each row should be a link leading to a different page. I can of course add onclick handler, but that will create ...
- 101
2
votes
1
answer
209
views
Carousel Using Vanilla Javascript
As a beginner project, I've start working on this carousel slider that would slide through an image and a testimonial on click.
The number of images and content slides would always be the same number. ...
- 23
2
votes
1
answer
181
views
Sticky Table Header in Plain JS
I wrote a code for sticky/fixed table header. I am bit confused with my coding, though it does my job. I know there are many jQuery codes available online. But I wanted to do it in plain JS with IE ...
- 21
2
votes
0
answers
71
views
Hashtable Visualizer in TypeScript
Implementation is based on the MVC design pattern, with callbacks to allow model and view to communicate with controller.
Concerns:
It's not ideal to have async code inside the model, i.e the model ...
- 419
2
votes
1
answer
2k
views
Java CSV to XML converter
I'm relatively new to programming and I was trying to work a project.
I would like recommendations of how to annotate or comment my project and any improvement I could make to it, any suggestion is ...
- 21
6
votes
3
answers
479
views
Selecting elements from the DOM of a page
To get the book list from https://www.java67.com/2015/09/top-10-algorithm-books-every-programmer-read-learn.html , I am using the following code in the console of the firefox DevTools:
...
- 471
3
votes
4
answers
510
views
Digital Clock Script
While learning JavaScript I thought it was a good idea to make a digital clock program. I followed a youtube tutorial (with some tweaks to my preference) and came up with my final code that I have. I ...
- 165
12
votes
3
answers
1k
views
Simple Calculator Script
I written my own calculator script in javascript! It is a basic one, but works really well. I am just wondering if there is any way to make this script more efficient & clean. On first look, I ...
- 165
2
votes
1
answer
356
views
Recursive function with Promise and setTimeout to ping DOM
I use this function in browser automation. It pings the document in the browser to check if an element we are looking for is available (useful when there is JavaScript generated async content). If it'...
- 373
2
votes
1
answer
50
views
Creating multiple DOM buttons in JavaScript (I am not DRYing)
I am making a Tic-tac-toe game and I have the basic board but I am repeating the code and it is very badly written. I am wondering how I can use better practices to write the DOM elements that I need.
...
- 55
2
votes
1
answer
66
views
Generating a new web-page template and adding multiple new elements with pure JavaScript?
So, I am trying to generate a web-page template with JavaScript according to user specified values. I tested it with just background-color and made it working.
I ...
2
votes
2
answers
452
views
jQuery form.find radio class
In my application we have four inputs that are radio controls and the first radio control is checked by default. When the user selects another radio control and then saves the form I want to get the ...
- 361
1
vote
1
answer
217
views
Counting the number of click on the entire page
In an interview I was giving the following problem:
Count the number of click on on the entire page.
Can you think of a better way to do this?
...
- 133
0
votes
1
answer
42
views
Code to modify DOM element using DOM.style property
So, I've a code that is below which works just fine:
...
3
votes
0
answers
45
views
Displaying sections from pre-checked options
First off, not the greatest with jQuery but know enough to get by. I have a custom script for our WordPress site that ties in with a main plugin we use. I have a JSFiddle that gives the gist of what ...
- 51
1
vote
0
answers
2k
views
Escaping invalid XML characters (e.g. for the Java DOM API)
I want to save and load an arbitrary Java String in a Text node in a XML file using the Java DOM API.
The ...
- 111
2
votes
2
answers
71
views
Find size for elements to fit in certain width
This is a follow-up on Change size of elements until parent reaches certain height
The goal of the function is to find a size for the elements inside a parent, so they all fit in a single row. I ...
- 75
4
votes
1
answer
59
views
Change size of elements until parent reaches certain height
I wrote this method and I would like to refactor it so it is easier to understand and looks cleaner. However, I don't know how or where to start. If you could give it your best shot and explain your ...
- 75
4
votes
1
answer
122
views
Enables markup to instantiate objects, call methods, and generate HTML
I created this package PXP.
PXP enables markup to instantiate objects, call methods, and generate
HTML. It works similar to a server-side templating engine, but rather
than enforcing braces it ...
- 161
0
votes
1
answer
46
views
Jquery Selector optimization for multiple clicks
I have multiple inputs that each one has an increment and decrement button
The buttons will be pressed multiple times so i am looking to optimize my selector:
So should i keep the first one (which ...
- 127
5
votes
1
answer
126
views
Video player UI in Javascript/JQuery
I am a Javascript/JQuery beginner working on my first ever project. Everything in this program is working as it should and I am happy with its performance. I have pieced it together from a variety of ...
- 59
4
votes
1
answer
382
views
6
votes
1
answer
482
views
Simple input class change with vanilla JS
I am just testing how I solved simple stuff.
Goal: The aim is to expand the width of an input and collapse it.
When mouseover ...
- 143