Mozilla will shut down Pocket’s services on July 8, 2025. At that time users will no longer be able to access the Pocket website, apps and API. You can export your saved items and API data until October 8, 2025 before they are permanently removed. For more information, see this article.

Avatar for Username

Avoid support scams. We will never ask you to call or text a phone number or share personal information. Please report suspicious activity using the “Report Abuse” option.

Learn More

This thread was archived. Please ask a new question if you need help.

createElement does not support inline style

  • 1 reply
  • 2 have this problem
  • 23 views
  • Last reply by cor-el

PJAL
PJAL

The createElement javascript call and subsequent appendChild call should accept the inline style attribute format. In the first example below five lines of code are required when the second example below creating the same element uses the inline style format only requires one line. Additionally, it is necessary to know the different attribute names when switching between style formats.

The goal should be to use inline style format with every element. All other style format usage should be discouraged and marked as deprecated.

The inline style format supports "vertical" code compression by allowing all style attributes to be set all on one line of code. 

 dataFrame = document.createElement("iframe");
 dataFrame.id = "plotFrame";
 dataFrame.name = "displayData";
 dataFrame.style.border = "1";
 dataFrame.style.top = "100px";
 dataFrame.style.left = "0px";
 dataFrame.style.width = "1100px";
 dataFrame.style.height = "730px";
 document.body.appendChild(dataFrame);



 //document.writeln("<iframe id='plotFrame' style='position:absolute; border:1; top:100px; left:100px; width:1100px; height:730px;'></iframe>");
The createElement javascript call and subsequent appendChild call should accept the inline style attribute format. In the first example below five lines of code are required when the second example below creating the same element uses the inline style format only requires one line. Additionally, it is necessary to know the different attribute names when switching between style formats. The goal should be to use inline style format with every element. All other style format usage should be discouraged and marked as deprecated. The inline style format supports "vertical" code compression by allowing all style attributes to be set all on one line of code. dataFrame = document.createElement("iframe"); dataFrame.id = "plotFrame"; dataFrame.name = "displayData"; dataFrame.style.border = "1"; dataFrame.style.top = "100px"; dataFrame.style.left = "0px"; dataFrame.style.width = "1100px"; dataFrame.style.height = "730px"; document.body.appendChild(dataFrame); //document.writeln("<iframe id='plotFrame' style='position:absolute; border:1; top:100px; left:100px; width:1100px; height:730px;'></iframe>");

Modified by PJAL

Chosen solution

The preferred way is to use DOM methods to add elements afterward and not use writeln as the latter may not always work properly even if it is easier to write down.

You can probably still use setAttribute("style", ""); to set all style rules for that iframe in one line.

Read this answer in context 👍 1

All Replies (1)

cor-el
cor-el
  • Moderator

Chosen Solution

The preferred way is to use DOM methods to add elements afterward and not use writeln as the latter may not always work properly even if it is easier to write down.

You can probably still use setAttribute("style", ""); to set all style rules for that iframe in one line.