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
0answers
28 views

Connect 4 in TypeScript

This is my first TypeScript program, so I'm curious as to what conventions and optimisations I may have missed. Concerns: I'm not sure whether to check for 4 in a row in the entire board or to just ...
3
votes
4answers
115 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 ...
11
votes
3answers
544 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 ...
2
votes
1answer
38 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'...
2
votes
1answer
27 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. ...
1
vote
1answer
40 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 ...
1
vote
2answers
129 views

jQuery form.find radio class

In my application we have four inputs radio controls and on the load the value is checked to true. When the user select another radio and then save the form I want to get the new value. I am using the ...
1
vote
1answer
55 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? ...
0
votes
1answer
36 views

Code to modify DOM element using DOM.style property

So, I've a code that is below which works just fine: ...
0
votes
0answers
14 views

Is it possible to optimise jQuery tag:contains() selector?

I am trying to extract all the elements from a webpage which contains given set of words. E.g. Given I have an array of random words ...
3
votes
0answers
39 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 ...
1
vote
0answers
294 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 ...
2
votes
2answers
46 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 ...
4
votes
1answer
47 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 ...
4
votes
0answers
53 views

Enables markup to instantiate objects, call methods, and generate HTML

I'm looking for a code review for the package PXP. https://github.com/hxtree/PXP/ PXP enables markup to instantiate objects, call methods, and generate HTML. It works similar to a server-side ...
0
votes
1answer
29 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 ...
5
votes
1answer
104 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 ...
2
votes
1answer
95 views

Simple Password Generator in JavaScript

...
6
votes
1answer
151 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 ...
8
votes
2answers
368 views

Webpage with a preload animation using JavaScript setTimeout

I am working on a website with an animation that runs at the beginning before the content of the homepage becomes visible. I've looked at some examples of preloaders and now use that code with some ...
1
vote
1answer
58 views

Automatically select the table rows between two selected rows

The code is to check the rows in a table. If in a table two non consecutive rows are checked then all the in between rows should be selected by itself. Also, after selecting two rows, on selection of ...
3
votes
0answers
153 views

Parse DOM Tree in C++ [closed]

Problem I need to read custom text input of a sample document object model (DOM) represented in a json format from a file and store it in a struct I've defined as ...
2
votes
1answer
62 views

javascript carousel

I made this javascript code for a simple slider that can be controlled by arrows up/down. I'm wondering what I could have done better.. ...
2
votes
1answer
56 views

Add or remove a class on two elements when two different events fire

I want to add/remove a class on the html and body tags in the dom when my nav menu is opened or closed. Is this the most optimal way of writing this logic? ...
4
votes
1answer
77 views

Screen transition effect like in Final Fantasy games

I've created a battle screen transition effect similar to Final Fantasy games, you can see it in action here: https://gilles-leblanc.github.io/ff8-transition/ I'm interested in code quality, ...
2
votes
2answers
70 views

Cardinal direction enum from range input

Still learning JS and I made the following function to convert degrees into cardinal directions respectively. My first iteration of the code was over 50 lines and I was able to get it down to 13 using ...
0
votes
1answer
461 views

Extract HTML tags and its content from a string [closed]

Goal I want to extract HTML tags and its content from a string. The content (input) is queried from WordPress database. Sample data (input) I extract this dummy data from my WordPress database: ...
4
votes
2answers
116 views

Dynamically add/remove fields on input

The following code allows users to enter multiple optional quantity fields after first filling in a value of the current quantity input. If the input field contains a value it will then display the ...
4
votes
1answer
83 views

Event triggers for animations using vanilla ES6

I'm new to JS and wanna know right code style or approach to cod Vanilla JS using ES6. To practice this, I'm using ESLint JS code-style of AirBnb and referencing clean-code-javascript repo. However, I ...
3
votes
0answers
37 views

Function to flip cards in a memory game

I've developed a small memory game, the game contains a function to flip cards for every turn. I'm looping thru the array containing the images every time to pick one card. I'm sure there's away to ...
2
votes
1answer
66 views

Toggling the background color of a page using JavaScript closures

This question is to see if I can get some input on the "design pattern" I tried to implement here. I'm just learning about closure in JavaScript and I think I'm starting to get it. I'm wondering if ...
2
votes
1answer
53 views

Dynamically inserting html from external file and updating the database

I need some suggestions on how to approach this. I want to allow users to create sections of website. The code so far is working but since I am new to back-end I feel like there is better, more ...
2
votes
0answers
57 views

Wait for an element to exist in DOM before clicking it

Here is the problem: some script is injecting some HTML5 elements (actually a button with the #thebutton ID) to the current DOM. But this is a third party script ...
3
votes
1answer
62 views

Basic input system for a few form fields

I am attempting to port a linear function that I designed in a spreadsheet into HTML and Javascript. It's based on linear least squares where I have to take a Matrix and multiply it by its ...
1
vote
0answers
19 views

Creating a reusable plugin (Dialog/Notifier as example)

I started working on a notification system that is pluggable into any project. I have not made any "plugin" type javascript libraries, usually just functions very specific to the project at hand. That ...
1
vote
1answer
51 views

JQuery Selector in Vanilla JS

I've decided to reproduce the JQuery selector - specifically for finding elements by class name, ID, and tag So for example the tests could be written like ...
2
votes
0answers
398 views

Angular 8: Scroll spy implementation for a timeline Contents

I have made a timeline component that can have multiple milestone/major/minor as sub components nested within timeline container component. I have also added a side navigation for that lists all ...
3
votes
0answers
89 views

Copy-to-clipboard function from a React.js component

I have a React component with a copyToClipboard method, which all works fine, but feels extremely verbose and quite hacky (namely, having to create a new select ...
4
votes
1answer
53 views

Modularized JavaScript event handler to increment counters

In the following code we use the function Incrementer (capitalized for clarity, despite that it's to be used without new), to ...
3
votes
1answer
37 views

helper function to determine if html text is wrapped with a certain tag

I have this code that I've made to parse a string of HTML and tell me if it is all enclosed within a specified tag: ...
3
votes
3answers
138 views

Simple javascript code to create an image caption

I'm trying to become better at javascript and have written a simple script that just creates some html from getting some details from some elements (e.g. the image alt text) and inserts it onto the ...
2
votes
1answer
61 views

Is this a proper way to cancel an onMouseOver which uses setTimeout? (Vanilla JS)

I've got a working solution for an onMouseOver event which rolls over a set of images and replaces them in the element. Due to my lack of knowledge in JS I would ...
3
votes
2answers
336 views

jQuery dynamic toggle class function

I wrote this function that will toggle a class of a targeted element. Applying the class js_class_toggle to any element will trigger the function when clicking on ...
2
votes
0answers
66 views

Vanilla Javascript code to sort nested tables

I have written a code to sort a main table containing tables in each of its rows. Here I am trying to sort the table by first sorting the rows in each of the main rows and then sorting the table from ...
1
vote
0answers
27 views

Dragging and dropping a spot using TypeScript

Currently my code is based around mouse events so that it is easier to test but I will be swapping these to touch events once I have had the code reviewed. The idea of the UX is that you need to ...
0
votes
2answers
177 views

Asynchronous query to load products from laravel controller

The following code works fine. When a user clicks on an element, an AJAX request is made, which will return the query result. The results are being displayed in a view. I read many articles where ...
6
votes
0answers
73 views

Todo list using pure JavaScript [closed]

I watched a YouTube video and completed the Todo List using Pure JavaScript. Below is the code I wrote. I want to improve this code, but it 's not clear how. I want to change this code to ...
6
votes
2answers
439 views

Tic-Tac-Toe code in JavaScript

I have developed a tic-tac-toe game in native JavaScript. Can you tell me how to optimize more and what are the missing things? JSBIN The logic, modular approach, testable and scalable? ...
1
vote
1answer
63 views

Targeting only 1 event in DOM

In the picture below, I want to open a modal when a user clicks anywhere within in the yellow block, including if they click on the white ‘+’ sign. The problem is, the click event happens on a ...
1
vote
1answer
26 views

Summing buying and selling rate fetched from the web txt

I've got a class that is like a facade, like an engine for my application which is responsible for fetching data from url and summing it. I have got problem with proper names for my methods. ...

1
2 3 4 5
8