Run results for: change css property

Run details:

User agent: Mozilla/5.0 (Windows NT 10.0) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/96.0.4664.55 Safari/537.36 Edg/96.0.1054.41

Browser: Chrome 96

Operating system: Windows

Device Platform: Desktop

Date tested: 2 years ago

HTML Preparation code:

<div id='id'></div>

Script Preparation code:

var el = document.getElementById('id');

Tests:

setProperty method
el.style.setProperty('font-size', '14px') el.style.setProperty('color', 'blue') el.style.setProperty('font-size', '16px') el.style.setProperty('color', 'red')
set property
el.style.fontSize = '14px' el.style.color = 'blue' el.style.fontSize = '16px' el.style.color = 'red'
change cssText
el.style.cssText = 'font-size: 14px; color: red' el.style.cssText = 'font-size: 14px; color: blue' el.style.cssText = 'font-size: 16px; color: blue' el.style.cssText = 'font-size: 16px; color: red'
add cssText
el.style.cssText += 'font-size: 14px' el.style.cssText += 'color: blue' el.style.cssText += 'font-size: 16px' el.style.cssText += 'color: red'
change multi cssText
el.style.cssText = 'font-size: 14px; color: blue' el.style.cssText = 'font-size: 16px; color: red'
setAttribute method
el.setAttribute('style', 'font-size: 14px; color: red') el.setAttribute('style', 'font-size: 14px; color: blue') el.setAttribute('style', 'font-size: 16px; color: blue') el.setAttribute('style', 'font-size: 16px; color: red')
multi setAttribute method
el.setAttribute('style', 'font-size: 14px; color: blue') el.setAttribute('style', 'font-size: 16px; color: red')