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.

Filter by
Sorted by
Tagged with
1
vote
1answer
82 views

Continuously update position of div with click event

I am trying to continuously get the position of a div on screen and update the new position each time a "click" event listener is clicked. At the moment my code works but feels redundant and could be ...
5
votes
2answers
513 views

Upvote/counter in Javascript

Looking to improve building UI in pure ES6. This is the pattern I have adopted and has worked fairly well. This code increments the count, sets a data attribute to toggle the button, and issues a ...
4
votes
3answers
93 views

Breaking group of items into rows then ensure consistent height of each row element

I'm working on a product category page where the product images have inconsistent heights so I've been asked to improve the page appearance without changing the images. The page contains x number of ...
3
votes
2answers
93 views

jQuery handler to update map UI based on AJAX response

I am working on a university project that consists of creating a map application with openlayers as well as the necessary User-Interface. I am using jQuery, native JavaScript, PHP and of course HTML/...
2
votes
1answer
103 views

To Do List using basic JS

I learned javascript from some tutorials and as per advice, I thought of creating some task by my self. I wrote the following code and as I expected I saw the answer. If someone can assist me with how ...
1
vote
1answer
1k views

To-do list with counting of checked items

For practice JavaScript I created simple To-do app. This app can add TODOs and track the number of total TODOs as well as the number of unchecked TODOs. For this I written 4 functions: for add ...
3
votes
1answer
122 views

JavaScript flipping clock

Here are two simple classes - Digit class maintains digit behaviour - primarily flipping animations, and Clock class handles everything that is related to time data. I'm going to use this code for ...
3
votes
1answer
116 views

JavaScript code to add buttons and slowly remove them

My javascript code is working, however i am seeking suggestions on how I can go about improving my existing code for reusability and testability. The code is pretty straight forward, I have three ...
2
votes
1answer
60 views

Appending data to a web page from a form using a JavaScript class

Recently I've been reading about classes in JavaScript and decided to code this simple form to test them out. Even if the code works I am still pretty sure I lack understanding of classes and other ...
1
vote
1answer
205 views

JavaScript debounce function

I built one JavaScript debounce function. I need a JavaScript expert's opinion if this is the correct way to do it, and if not, then what the flaw is in this current function. ...
6
votes
1answer
83 views

map of SF transit cars

Please provide general and any specific criticism of the following which is intended to provide a map of SF transit cars. The code can be viewed in the working version and also in a group of gists. ...
6
votes
1answer
138 views

Add the number of descendants for each li node

A web page has a nested list. The goal is to insert the number of descendants for each li node (except for leaf nodes). Here is an example of the expected output: ...
-1
votes
1answer
358 views

Simple HTML website with a JavaScript navigation bar (version 3)

This is a followup post to version 1, and version 2. The following code is a website with a nav-bar on it. It uses some simple JavaScript and CSS (with media-queries) to make it work: index.html: <...
2
votes
0answers
31 views

Moving a div to a different parent, which also moves, using matchMedia

I'm very new to JavaScript so I thought I'd ask for someone to have a quick look over this to make sure it isn't brittle, buggy, or completely unnecessary. It may be all three. I also thought it might ...
3
votes
1answer
305 views

React pagination without JSX

I've published my first react project for pagination purposes. It's likely I'm making mistakes or there are any improvements to my code. I'd appreciate if anyone has any offers. ...
9
votes
2answers
5k views

Showing two d3.js charts on the same page

I created two graphs in d3js: a bar chart and a donut chart. These two graphs use the same json object for data and share an input range and the radio button. This is the code: ...
1
vote
0answers
62 views

Retrieve data from big xml files

I have written a code to retrieve data from xml file. It works but it is really slow. I takes about a minute. This is ok for 1 or some more xml files. But If you have to do it for 1000 it's not a good ...
11
votes
3answers
2k views

Simple dice game - JavaScript MVC implementation

I did a simple dice game using what I learned about separating the 'view', 'model', and 'control'. I am quite clear on what the model is (it's the data and state). But I'm a bit confused on the ...
6
votes
1answer
160 views

3D 1st Person Snake Game #3

Final iteration of an iterative review. The previous iteration is here: 3D 1st Person Snake Game #2 Note: For the snippet, click run, "Full page", purposely lose, and then type r. Here is the ...
5
votes
1answer
175 views

3D 1st Person Snake Game #2

This is an iterative review of this question: 3D 1st Person Snake Game #1 The next iteration can be found here: 3D 1st Person Snake Game #3 Here is a snippet of the code: ...
0
votes
1answer
7k views

Parse xml and store into mysql table in python [closed]

I have written the code that retrieves the data from XML file using xml.etree. Is there any best way to store the data into database by parsing an XML file. My code: ...
5
votes
1answer
1k views

HTML5 audio player with CSS-styled interface for pages with multiple MP3 sources

This is one of my first JavaScript projects. It works (at least in Firefox and Chrome), but I would like to know if this code follows common best practices. This script is supposed to look for ...
2
votes
2answers
115 views

Manipulating the browser history

I created a table with the ability to edit with popup. This part of the code, which includes: the ability to send URL to other users with the subsequent opening of the same state (the popup window ...
1
vote
2answers
56 views

Updates href values for a limited collection of links on a page

As much as it hurts, I've been tasked with writing a script that prepends integration, QA, etc. environment segments to anchor href attributes that link to a series of sites within two specific ...
3
votes
2answers
550 views

Two setIntervals activating in a sequence to change CSS

I'm making a Simon game and I made this function to show flashing lights: ...
3
votes
0answers
2k views

Converting HTML input characters to asterisks after a given time

I tried for fun implementing a function that converts HTML input characters to asterisks after a given time. What do you think about my approach and how would you do it? ...
3
votes
1answer
215 views

Connect Four variant, allowing only horizontal and vertical wins

I'm brand new in JavaScript (and in programming in general). I've made a Connect Four game that checks for the winner vertically and horizontally (I haven't figured out how to solved it diagonally). ...
2
votes
1answer
3k views

Script to load controllers dynamically for AngularJS

I would like to hear your thoughts, idea's or feedback on the following code. Ive added to code to github. https://github.com/redbullzuiper/angularjs-dynamic-controllers Usually when you attach a ...
3
votes
1answer
73 views

Dynamic DOM Text Editor Performance

I am creating a text editor that will need to work in the browser, syntax highlight, and allow users to edit files up to 50MB in size (i.e. the space allowed by indexedDB) without an "out of memory" ...
2
votes
2answers
114 views

Display the time left of a given time

Context This software is a countdown/visual timer. It was initially developed to display the time left before the end of an exam. Question My JavaScript is working but when I want to validate it by ...
6
votes
1answer
379 views

JavaScript module to render and handle a form to add users

I recently switched to modular JavaScript and really like the idea of having the state of your application in JavaScript and not in the DOM. I want to know if what I am doing is considered best ...
3
votes
4answers
3k views

JavaScript Random Color Generator

I made a page to generate a random color with JavaScript and set that color to the background of the page. ...
6
votes
1answer
324 views

Simple color clicker game

My friend recently made a color clicker game, and I tried cleaning up the code a bit. I want to know how I can improve the functions and passing/editing of global variables. There are a lot of ...
2
votes
1answer
86 views

A simple AngularJS application for counting the number of gallons of paint

I created a simple Angular JS application for calculation gallons of paint needed to paint the ceiling of a room. I assume one gallon covers 350 square feet and use it as a constant. Also, I round up ...
8
votes
2answers
1k views

HTML/Javascript Hex to RGB and RGB to Hex Color Converter

I have recently started learning JavaScript (A great language) and decided to start a small project which consists of a website with two inputs, one for hexadecimal input, and one for RGB input. When ...
2
votes
1answer
1k views

Create multiple parametherized JQueryUI dialog boxes

In my application, I am using a lot of jQueryUI dialog boxes. In order to reduce the length of code, and because I am using often the very same parameterization, I was wondering about a way to ...
6
votes
1answer
541 views

Clock that changes document background color

This is a timer based clock (using setInterval()) that changes the background color of the body based on the clock time hexadecimal values. I suspect that this code ...
2
votes
0answers
37 views

Remove General sibling on Keyup

I am creating a search filter using jQuery and implementing Array.prototype.filter(). What I have done is that I call the ...
4
votes
1answer
874 views

Simple application for the game “Mad Lib”

It is an application for the game "Mad Lib". I decided to use bootstrap modal for the questions. Mad libs are a simple game where you create a story template with blanks for words. You, or another ...
3
votes
1answer
64 views

Altering SE sites to imitate SO's appearance

Some time ago someone complained that sites that were not stackoverflow were hard to read at work since people might be screen watching. So I bashed some code and created SO-ify. Some time and several ...
5
votes
1answer
17k views

Append multiple children to a node at once

This my attempt at an answer for a question over on SO: Append multiple items in JavaScript I'd like to know if I've made any mistakes as far as writing idiomatic ES6 JavaScript (mainly regarding ...
1
vote
1answer
2k views

Creating HTML table with JSON data using pure JS

In the below function I'm fetching data from a JSON object, then creating and populating a HTML table with the contents. Yes the code is readable but I feel that it just looks too long winded for what ...
2
votes
2answers
419 views

addEventListener after fetched data

This is working code, but I want to simplify, correct, and improve the code. ...
2
votes
2answers
678 views

Get JSON script code with pushing to heatmap

I have a script that makes a database call and then filters the results. After filtering it pushes it to an array and shows it on a map. Here is my function: ...
1
vote
1answer
112 views

Fetching and parsing JSON data from the Oodle API

Here is a working proof of concept in vanilla JS that uses the fetch API to retrieve and parse JSON data. Coming from a server-side background, I wanted insight as to where my beginner JS skills could ...
1
vote
1answer
958 views

Getting table cell contents in a row and displaying them as a concatenated tooltip on each cell

I have a JavaScript code that gets the inner text content of certain table cells in a row and displays them as a tooltip on mouseover. However, I am a novice at JavaScript and I do not know how to ...
6
votes
2answers
2k views

Platformer without canvas

Well I had a idea about making a platformer but wanted to challenge myself to doing it without using canvas. It uses some other codes from github for collision detection. Here is the result. <...
9
votes
3answers
668 views

Carousel in Vanilla JavaScript

I finally got my carousel to work in JavaScript, and I want to know what you guys think about it and what I can do better. ...
-1
votes
2answers
1k views

Removing tags from HTML

I'm working on a small project (something like a blog) where users can write articles and I made this function to prevent XSS based on a few answers I found on Stack Overflow about removing HTML tags ...
2
votes
1answer
91 views

Propagating table cell border colors to adjoining cells

I have a JavaScript function (which uses the jQuery library but that should not be relevant here) that takes as input an ID (integer), a color, and a side (all, top, right, bottom, or left). For each ...

1 2
3
4 5
8