Typescript SetAttribute Error

Question

When i execute a JS code in typescript, i get the following error:

ORIGINAL EXCEPTION: TypeError: Cannot read property 'setAttribute' of null

But It works perfectly in JS without any errors.

<HTML>
<path id="border" transform="translate(125, 125)"  style="stroke:white; marker-end:url(#InverseSemicircleEnd);"/>
</HTML>

TS:
document.getElementById("border").setAttribute("style",dec);

But not sure, why it results in error on TS. I also tried to change the name of the property for this ID, but no luck. Can some one help me in explaining on what i'm doing wrong here.

Thanks For your support Regards Suresh

Where is the TS code? Please post the whole component to see how the stuff is related. — Günter Zöchbauer
– Günter Zöchbauer, Commented Sep 1, 2016 at 11:16
@JuanMendes: Yes that's what happening. Thanks for pointing that out.. — sur
– sur, Commented Sep 2, 2016 at 6:08

PierBJX · Accepted Answer · 2023-01-23 19:46:11Z

1

Because document.getElementById could return null, you need to check if it is different from null.

const myEl = document.getElementById("border");
if (myEl !== null) {
  myEl.setAttribute("style",dec);
}

OR

document.getElementById("border")?.setAttribute("style",dec);

If you are sure that the element is defined and you want to avoid the check, use the ! (Non-null assertion) operator:

document.getElementById("border")!.setAttribute("style",dec);

Make sure that the browser has loaded before querying elements because not doing so could lead to a runtime error.

edited Jan 23, 2023 at 19:46

PierBJX

2,4125 gold badges26 silver badges58 bronze badges

answered Jan 16, 2023 at 16:43

Ivan Rodriguez

113 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

BlackCarDriver · Accepted Answer · 2019-08-13 02:41:49Z

0

I use the following way to solve :

  hideDesPan(){
    let pan = (<HTMLInputElement>document.getElementById('showPan'));
    pan.style.display = "none";
  }

answered Aug 13, 2019 at 2:41

BlackCarDriver

32 bronze badges

Collectives™ on Stack Overflow

Typescript SetAttribute Error

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related