I am looking to create an array containing the font sizes of all the p tags in my HTML document. How can I specifically target only the p elements and not their parent elements?
I am looking to create an array containing the font sizes of all the p tags in my HTML document. How can I specifically target only the p elements and not their parent elements?
If you want to retrieve font-size values from HTML elements, you can try using the following code:
Find more information here: https://developer.mozilla.org/en-US/docs/Web/API/Window/getComputedStyle
var paragraphs = document.getElementsByTagName("p");
var fontSizes = [];
for(var i=0; i<paragraphs.length; i++) {
var style = window.getComputedStyle(paragraphs[i], null);
fontSizes.push(style['font-size']);
}
console.log(fontSizes);
Check out this demo for a live example: http://jsfiddle.net/1us76t0g/1/
Even if there are no inline styles defined, this method allows you to gather font-size values into an array.
I'm currently developing a Django app, and I have encountered an issue where the CSS is not loading when I run different pages through the server. Oddly enough, everything works fine when I open the files directly without using the server. The problem ...
Currently, I am tackling the situation described below: 1) I have an HTML page labeled A with an input of type text. 2) Upon selection, I trigger an Ajax call to another HTML page, B, in order to retrieve data from a MySQL database. 3) The retrieved dat ...
Objective: When the next/previous button is clicked, the label on the current slide should change to display the next/previous category. View the Category Slider Wireframe for reference. Context: I previously tried a solution called 'Obtain Next/Prev ...
Every time I try to run this code on my webpage, the buttons do not seem to respond when clicked. I am aiming to have the user input for full name, date of birth, and gender displayed in the text box when the display button is clicked. When the next butt ...
I've been working on updating a JavaScript function to trigger both on page load and window resize instead of just a click event. In the code snippet below, I've made adjustments by commenting out the section related to the click event, added "wi ...
I'm trying to wrap my head around the code structure of a solution I stumbled upon. The issue at hand: Create a function that takes in a string with only lowercase letters as a parameter, and returns an object with each letter and the number of times ...
login.html file: {% extends "base.html" %} {% block content %} <div class="container login-page-form"> <form id="login-form" action="/auth/login" method="post"> <div class="f ...
My keystonejs application is successfully clustered using throng, but I am encountering an issue when running the following code: const throng = require("throng"), dotenv = require('dotenv'); (function usedotenv() { try { dote ...
My goal is to have multiple form fields on a page, gather the input results into an array, and then store them in a database. This process was successful for me initially. However, when I introduced an autocomplete function which retrieves suggestions from ...
I'm currently facing an issue with trying to delay certain actions using Cloud Firestore. Despite my attempts, the setTimeout/setInterval functions don't seem to be working as expected in my code. export const onTimerCreate = functions.firestore ...
I have encountered an issue with my website where I am unable to click on certain fields or buttons within the Login fieldset. Strangely, I can only interact with the fields and buttons located within the Register fieldset. The CSS for my website is writt ...
When attempting to query the Geonames data using select2, everything seems to work fine with formatting the results. However, an error occurs once the results are populated, which I suspect is preventing the formatSelection function from running properly. ...
As a beginner in programming, I am encountering an issue. When I run "npm run build" in the Terminal to compress my project in React.js, I encounter this error. Interestingly, I have previously created another project without facing this problem, and I can ...
My current project involves a website that functions smoothly in Chrome, but encounters issues with running JavaScript/jQuery scripts in IE8. Even a simple alert on page load fails to execute. Admittedly, my approach is a bit messy as I have mixed CSS an ...
I have implemented Sortable.JS in a form builder to enable drag and drop functionality. My goal is to allow users to drag sections (which is mostly working) and questions within those sections, either within the same section or into other sections. The is ...
An AJAX call has returned a response consisting of a list of <a> elements: <a href="/1/">One</a> <a href="/2/">Two</a> <a href="/3/">Three</a> I am looking to select only the first n a elements from this response ...
Currently, my goal is to update the color of a span tag only if its value is 0. I attempted to achieve this with the following code: $('span.number:contains("0")').css('color', '#C1C1C1'); However, this code also changes the ...
I'm currently in the process of updating my Redux state within a component by utilizing a variable that has been passed up to the component from a child, specifically through a form submission callback. The form is responsible for submitting a user&ap ...
I need to display a pop-up with data from a table row, similar to the image at this URL for CS WHOLESALE GROCERS. I've implemented the following AngularJS code in my controller: app.directive('tooltip', function(){ return { res ...
I'm having trouble locating the documentation I need. Within my Firebase Firestore project, there is a collection called users. Within users, there are three collections: companies, policies, and stores. In the policies collection, I have fields for ...