You are viewing a plain text version of this content. The canonical link for it is here.
Posted to dev@flex.apache.org by Harbs <ha...@gmail.com> on 2017/06/27 16:58:55 UTC

[FlexJS] Use of innerHTML

There’s a number of components which use innerHTML for setting text values. (ImageAndTextButton, Label, StringItemRenderer, TextButton)

I just came across an article which advises against doing so.[1]

Does anyone have a reason to not use append[2] and/or Node.textContent[3] and appendChild[4]?

Harbs

[1]https://developer.mozilla.org/en-US/docs/Web/API/Element/innerHTML#Security_considerations <https://developer.mozilla.org/en-US/docs/Web/API/Element/innerHTML#Security_considerations>
[2]https://developer.mozilla.org/en-US/docs/Web/API/ParentNode/append <https://developer.mozilla.org/en-US/docs/Web/API/ParentNode/append>
[3]https://developer.mozilla.org/en-US/docs/Web/API/Node/textContent <https://developer.mozilla.org/en-US/docs/Web/API/Node/textContent>
[4]https://developer.mozilla.org/en-US/docs/Web/API/Node/appendChild <https://developer.mozilla.org/en-US/docs/Web/API/Node/appendChild>


Re: [FlexJS] Use of innerHTML

Posted by Alex Harui <ah...@adobe.com.INVALID>.
+1 for changing to textContent.  We started out wanting to support IE8
which didn't have textContent, but IE8 is no longer our baseline.

Thanks,
-Alex

On 6/27/17, 9:58 AM, "Harbs" <ha...@gmail.com> wrote:

>There’s a number of components which use innerHTML for setting text
>values. (ImageAndTextButton, Label, StringItemRenderer, TextButton)
>
>I just came across an article which advises against doing so.[1]
>
>Does anyone have a reason to not use append[2] and/or Node.textContent[3]
>and appendChild[4]?
>
>Harbs
>
>[1]https://na01.safelinks.protection.outlook.com/?url=https%3A%2F%2Fdevelo
>per.mozilla.org%2Fen-US%2Fdocs%2FWeb%2FAPI%2FElement%2FinnerHTML%23Securit
>y_considerations&data=02%7C01%7C%7C2a52dbd74fda453e556108d4bd7dd0b8%7Cfa7b
>1b5a7b34438794aed2c178decee1%7C0%7C0%7C636341795454708914&sdata=yPpKbV3gaf
>pk0uuHilocMBRmxEph7IOxcgqNdT75F3I%3D&reserved=0
><https://na01.safelinks.protection.outlook.com/?url=https%3A%2F%2Fdevelope
>r.mozilla.org%2Fen-US%2Fdocs%2FWeb%2FAPI%2FElement%2FinnerHTML%23Security_
>considerations&data=02%7C01%7C%7C2a52dbd74fda453e556108d4bd7dd0b8%7Cfa7b1b
>5a7b34438794aed2c178decee1%7C0%7C0%7C636341795454708914&sdata=yPpKbV3gafpk
>0uuHilocMBRmxEph7IOxcgqNdT75F3I%3D&reserved=0>
>[2]https://na01.safelinks.protection.outlook.com/?url=https%3A%2F%2Fdevelo
>per.mozilla.org%2Fen-US%2Fdocs%2FWeb%2FAPI%2FParentNode%2Fappend&data=02%7
>C01%7C%7C2a52dbd74fda453e556108d4bd7dd0b8%7Cfa7b1b5a7b34438794aed2c178dece
>e1%7C0%7C0%7C636341795454708914&sdata=fKsmCzXrzIJ2x4WsbAb8ot9QipWrqRAmVnJb
>vjlKnTg%3D&reserved=0
><https://na01.safelinks.protection.outlook.com/?url=https%3A%2F%2Fdevelope
>r.mozilla.org%2Fen-US%2Fdocs%2FWeb%2FAPI%2FParentNode%2Fappend&data=02%7C0
>1%7C%7C2a52dbd74fda453e556108d4bd7dd0b8%7Cfa7b1b5a7b34438794aed2c178decee1
>%7C0%7C0%7C636341795454708914&sdata=fKsmCzXrzIJ2x4WsbAb8ot9QipWrqRAmVnJbvj
>lKnTg%3D&reserved=0>
>[3]https://na01.safelinks.protection.outlook.com/?url=https%3A%2F%2Fdevelo
>per.mozilla.org%2Fen-US%2Fdocs%2FWeb%2FAPI%2FNode%2FtextContent&data=02%7C
>01%7C%7C2a52dbd74fda453e556108d4bd7dd0b8%7Cfa7b1b5a7b34438794aed2c178decee
>1%7C0%7C0%7C636341795454718923&sdata=AOxVJBonY4ItxINJ0aHEJWTsautGdlQ%2B%2B
>RpX5T97Oj8%3D&reserved=0
><https://na01.safelinks.protection.outlook.com/?url=https%3A%2F%2Fdevelope
>r.mozilla.org%2Fen-US%2Fdocs%2FWeb%2FAPI%2FNode%2FtextContent&data=02%7C01
>%7C%7C2a52dbd74fda453e556108d4bd7dd0b8%7Cfa7b1b5a7b34438794aed2c178decee1%
>7C0%7C0%7C636341795454718923&sdata=AOxVJBonY4ItxINJ0aHEJWTsautGdlQ%2B%2BRp
>X5T97Oj8%3D&reserved=0>
>[4]https://na01.safelinks.protection.outlook.com/?url=https%3A%2F%2Fdevelo
>per.mozilla.org%2Fen-US%2Fdocs%2FWeb%2FAPI%2FNode%2FappendChild&data=02%7C
>01%7C%7C2a52dbd74fda453e556108d4bd7dd0b8%7Cfa7b1b5a7b34438794aed2c178decee
>1%7C0%7C0%7C636341795454718923&sdata=LdCvkC9EXCKdlMnpQK5iOUHXiofFFFRhOYV91
>LXEMTs%3D&reserved=0
><https://na01.safelinks.protection.outlook.com/?url=https%3A%2F%2Fdevelope
>r.mozilla.org%2Fen-US%2Fdocs%2FWeb%2FAPI%2FNode%2FappendChild&data=02%7C01
>%7C%7C2a52dbd74fda453e556108d4bd7dd0b8%7Cfa7b1b5a7b34438794aed2c178decee1%
>7C0%7C0%7C636341795454718923&sdata=LdCvkC9EXCKdlMnpQK5iOUHXiofFFFRhOYV91LX
>EMTs%3D&reserved=0>
>