As per MDN, the CSSStyleRule object's style property is declared as read-only. Is it possible to effectively modify its style attributes in modern web browsers like Chrome, Safari, Firefox, and even IE9?
On a related note, is there a method to access comments within a style rule and determine which specific rule or selector the comment corresponds to? For example:
.my-rule {
/* A Comment */
color: blue;
}
I am looking for a way to extract the /* A Comment */ using JavaScript.
Check out the LATEST DEMO
JavaScript Code :
var styles = document.getElementsByTagName('style')[0].textContent;
var comments = styles.match(/\/\*.*\*\//g);
console.log(comments);
UPDATE Info
For those interested in relationships with comments, try using this alternative code:
var styles = document.getElementsByTagName('style')[0].textContent;
var objItems = {};
var arrItems = styles.split('}');
arrItems.pop();
for (var i = 0; i < arrItems.length; i++) {
var grp = arrItems[i].split('{');
objItems[$.trim(grp[0])] = arrItems[i].match(/\/\*.*\*\//g);
}
for(var i in objItems) {
console.log(i + ': [ ' + objItems[i] + ' ]');
}
Currently, I am in the process of developing a recipe blog website using Mongoose, Node.js, and Express. However, I have encountered an issue with the text search functionality not producing the desired output. In my Recipe.js schema, I have included spec ...
let inbox = require("inbox"); let client = inbox.createConnection(false, "imap.gmail.com", { secureConnection: true, auth:{ user: "<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="99f4e0fcf4f8f0f5d9fef4f8f0f5b7fa ...
Could someone please assist me in converting my array of objects into an object or JSON format? Here is a sample snippet: var data = [ {"code":"M","montant":"2000","title":"Masculine"}, {"code" ...
To achieve a specific scrolling behavior on my webpage, I implemented the following function. Here is the code snippet: $(window).scroll(function(){ if ($(this).scrollTop() > 100) { $("html, body").animate({scrollTop: 700}, 500); re ...
(Apologies if the title is unclear, I struggled to phrase it accurately) I am attempting to retrieve a response from an API, however, the API is returning multiple responses with the same name. Example of a response: { "xuid": 2535436668322645, " ...
I would like to utilize the getByRole function for writing my test. However, I am encountering issues when using linkitem or 'link' as the role. It seems that I cannot find the desired element. // encountered error TestingLibraryElementError: The ...
Hey there, question coming from a newbie in the world of coding. I've been struggling to make pjax work for quite some time now without any success. The closest I've come is seeing some activity in the terminal, but when I click on the link, it ...
Similar Question: jQuery AutoComplete Trigger Change Event After successfully implementing the jQuery UI Autocomplete widget using version 1.9, I am curious to know if it is possible to trigger or bind a jQuery UI event. For example, can the jQuery UI ...
When I load my Vue component, I pass the array "ticket_data" as a prop. I am able to successfully make a post to a controller using an Inertia form without any issues. However, I am struggling to access individual values from the array... This is my curr ...
Looking for a way to adjust the filter of an svg object using javascript, specifically changing a grey shadow to red upon mouseover. The issue is that in Chrome and Safari, the desired effect does not occur, while Firefox functions as intended. When using ...
Currently, I have an application that utilizes Express along with Jade templates. I am in the process of developing a new version of the app using Angular and client-side HTML. In order to determine user permissions within my Angular code, I require acces ...
In my scene, I have a Mesh called cylinder: const cylinder = new Mesh( new CylinderGeometry(2, 2, 1, 32), new MeshPhongMaterial({ color: color, shininess: 32, opacity: 0, transparent: true, specular: 0xffff82, }), ); I made the ...
I have a form that needs to update values on click of a radio button. Unfortunately, my jQuery skills are lacking. Here's what I have tried so far: HTML: <form> <input type="radio" checked="true" id="q1r1" name="q1" value="Awesome"> ...
Following the recommendations from the comments, I have updated the code (still encountering the same error): const bcrypt = require("bcrypt") const User = require("../../model/userModel") export async function POST(req: NextRequest) { ...
A task has been assigned to create a script in JavaScript/jQuery (or other suitable technologies) that will return a domain with a .pl extension if the user's browser language is set to Polish. Otherwise, the script should return a .eu domain extensio ...
Currently, I am working on a Drupal project which includes JQuery in all pages. We have recently introduced Vue.js for creating dynamic components directly in the HTML pages (not for building a single-page application). However, we are facing an issue whe ...
I am currently working on passing function responses between two Node.js scripts. Here is my approach. Index.js var express = require('express'); require('./meter'); var app = express(); app.get('/',function(req,res){ ...
I need to make changes to the React index.html file on the server prior to delivering it to the browser upon request. My goal is to dynamically include open graph meta tags in the head based on the requested URL. Is there a way to accomplish this using N ...
I've been struggling with a problem in Angular for days now as I'm new to it. The issue is related to passing parameters in a component where the values are not displaying correctly. Initially, I attempted to pass parameters like this: <app-p ...
If I have a div element on an HTML page like this: <div class="Item1 Item2"></div> The class Item1 has its own set of rules defined with the following syntax. .Item1 { width: 100px; height: 20px; border: 5px solid white; } Is It ...