Let's say I wanted to create an input element using the DOM. Instead of doing something like this
var input = document.createElement("input");
input.setAttribute("class", "my-class");
input.setAttribute("type", "checkbox");
input.setAttribute("checked", "checked");
Is there a DRYer way to write these three lines of code into one line.
I know you could do something like this
var attributes = ["class", "type", "checked"];
var values = ["my-class", "checkbox", "checked"];
for (var i = 0; i < attributes.length; i++) {
input.setAttribute(attributes[i], values[i])
end
The problem is that is only helpful if you have a boatload of attributes you need to add. If you only have two or three, this is even less DRY.
Is there anyway I can dry up this code?
I personally think you're taking DRY too far (the three statements do different things, so I don't see how it's not DRY.) But if you must abstract it, just write a function to do it:
var input = document.createElement("input");
function setAttributes(el, options) {
Object.keys(options).forEach(function(attr) {
el.setAttribute(attr, options[attr]);
})
}
setAttributes(input, {"class": "my-class", "type": "checkbox", "checked": "checked"});
console.log(input);
Yes, You can do using Jquery.
$(input).attr(
{
"data-test-1": num1,
"data-test-2": num2
});
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With