Value-based JavaScript object prototype

Is there a way to ensure that every new object I create has its own unique dataTransfer property? For instance, when I try something like

Object.prototype.dataTransfer = new DataTransfer();
, I want a.dataTransfer.prop to remain 1 even if b.dataTransfer.prop is set to 2. How can I achieve this?

To give an example:

a.dataTransfer.prop to continue being equal to 1, not 2.

My goal context here involves attempting to modify WebKit and IE behavior related to the .dataTransfer object in drag and drop events for proper functionality.

Answer №1

Typically, the best practice would be to include it in the constructor function. However, given that you aim to extend a host object like HTMLDomElement, achieving this may prove challenging. Nevertheless, if you expand your problem statement beyond specific implementation details, there might be an alternative approach to consider. This could involve utilizing a library with a varying user interface depending on the browser being used, effectively abstracting the browser and providing a consistent API.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Using three.js to set the HTML background color as clearColor

How can I set the HTML background as clearColor using three.js? Here is the code snippet for three.js: // Setting up the environment var vWebGL = new WEBGL(); var scene = new THREE.Scene(); var camera = new THREE.PerspectiveCamera(75, window.innerWidth / ...

The only thing visible on my project is the homepage, void of any buttons or additional pages

After completing this school project, I believed that everything was done correctly. However, as I faced issues with the code, I decided to seek help and share my app.js and bin section for clarification. Starting it with npm on the localhost as shown in ...

Align Horizontal Fixed Element

<html> <head> <style> #rectangle { position: absolute; right: 0; bottom: 0; width: 150px; height: 200px; } </st ...

I am looking to include both the type and maxLength attributes in a MUI TextField

<TextField value={ele.mobile} helperText={ferrors[id]?.mobile} name="mobile" classes={{ root: classes.textField }} InputProps={{ clas ...

Using AJAX to Interact with PHP

Currently, I am facing a problem with my PHP code where my For each loop is not properly waiting for the response of the AJAX call. I have attempted to incorporate Promise functions to solve this issue but unfortunately, it did not work out as expected. ...

Tips for efficiently updating state in recompose by utilizing setTimeout?

Curious to learn more about recompose, my journey began with a basic component: const timer: React.SFC<MyProps | any> = ({ seconds }) => ( <span>{ seconds }</span> ); I wanted to find a way to pass the seconds prop using recompose, ...

Can you explain the execution process of this Http.post method and provide details about the code path it follows

As I delve into the world of web development, one aspect that has me stumped is the functionality of the Http.post section within a project I stumbled upon on GitHub. Specifically, this pertains to an ExpressJS with Typescript repository I came across. So, ...

The Vue.js application is experiencing issues with displaying Google Maps functionalities

I have developed an application using Vue.js in Monaca and Cordova with onsenUI. My goal is to display my location on a Google map within the page. I attempted to achieve this by utilizing the npm package named vue2-google-maps, but unfortunately, it' ...

Modify the divs in two separate occasions when submitting different forms

Within my form, I have radio buttons located inside div1, a captcha code to be solved in div2, and additional content in div3. My goal is to have div1 replaced by div2 when a radio button is checked and submitted. Then, after completing the captcha in div2 ...

Having trouble choosing an item from the Select2 drop-down menu

I have been developing an application that incorporates Select2 (version 3.5.1). The HTML used to create the dropdown / autocomplete field is as follows: <input id="mySelect" class="form-control" type="hidden"> The snippet above includes the form-c ...

Trouble getting search filter to function properly on an array of objects in a Vue JavaScript application

Can someone help me with integrating this code into my project? Here is the code I am referencing: http://jsfiddle.net/dkmmhf5y/701/ This snippet shows my JavaScript file, please disregard the 'test' data var app = new Vue ( { el: &apos ...

Ways to sum up the values within a JSON object

Currently, I am using an AJAX call to fetch JSON data from an API. My goal now is to add up all the visits. This is what I have implemented so far. Any suggestions on how I can achieve that? $(document).ready(function() { var X = []; var Y = []; var d ...

Integrating redux-form with the react-widgets DateTimePicker component

I am currently working on a project using ReactJS with Redux and I am trying to incorporate a form similar to the one shown in this example: Most of the components are working well, but I am encountering an issue with the DateTimePicker due to the momentL ...

Breaking down objects or arrays to extract specific values in React components

Some articles recommend using ES6 destructuring for React props & state as a best practice. For example: const { showModal, hideModal } = this.props; While I understand the benefits of cleaner code, I recently discussed with another developer who suggest ...

Error message from Firebase cloud function: We are unable to find a user record associated with the provided identifier

I am encountering an error when attempting to setCustomUserClaims in a trigger function. https://i.sstatic.net/QrLBT.png Here is the code snippet causing the issue: exports.onCreateCompaniesByUserFunction = functions.firestore.document('/com ...

Retrieve and manipulate the HTML content of a webpage that has been loaded into a

Hey, let's say I have a main.js file with the following code: $("#mirador").load("mirador.html"); This code loads the HTML content from mirador.html into index.html <div id="mirador"></div> I'm wondering if there is a way to chan ...

JavaScript problem with setting values in 2D array

I am attempting to assign values to a 2d array at particular indices. During each iteration, all sub-arrays at the j index are being assigned the same variable (number). inputTensor dimensions: 140x7 - 140 arrays of size 7 inputMinArray dimensions: 1x7 - ...

Clicking on a span will allow you to alter the text within a paragraph located in a

I am hoping to update a paragraph of text with new content when a faux 'link' (span) at the bottom of the page is clicked. This is what I have so far <body> <p> This is the paragraph that should be changed after clicking on the sp ...

Is there a way to transition an element from a fixed layout position to an absolute layout position through animation?

I am looking to create a dynamic animation effect for a button within a form. The goal is for the button to move to the center of the form, while simultaneously undergoing a horizontal flip using a scale transform. During the midpoint of this animation, I ...

Looking for jQuery bbq... is the grill fired up yet?

In my exploration of the jQuery bbq plugin, I noticed that there is no reference to document.hash in the code. I believe that the function for retrieving the hash is located at line 1094: function get_fragment( url ) { url = url || location.href; ...