Why is the fontFamily of this ejs variable undefined?-CodePudding

I have a website where users can submit text in whichever kind of font they'd like, and when their text is loaded on an ejs file, it displays the text in their chosen font. Here is the means of selecting the font:

<label for="fonts">Choose a font:</label>
         <select name="fontType" id="fonts">
             <option value="Verdana">Verdana</option>
             <option value="Times New Roman">Times New Roman</option>
             <option value="Georgia">Georgia</option>
           </select>
           <br><br>

In which, the text submitted and font chosen are both saved as String values into a MongoDB cluster.

On the ejs file, the text the user submitted is saved in variable t, and font in variable font:

<% let t = numbers.usertext%> <% let font = numbers.fontType%>

In which "numbers" is the object put forth by the index.js file in the form:

res.render("template.ejs", { numbers: numbers});

Then, later within a <script> tag, I define some JS varaibles:

let t = "<%= t %>";  let font = "<%= font %>;"

I thought all that would need to be done is something like this:

t.style.fontFamily = font;

However, I receive an error that "Cannot set properties of undefined (setting 'fontFamily')" and I do not know why this is. I am able to change the font of some <p> tags by means of using selecter.style.fontFamily = font no problem, but can not manipulate the properties of variable t for some reason.

CodePudding user response：

style is a property found on HTMLElement objects but t is a String (so its style property is undefined).

If you want to style some text you get from a JS string literal, you need to put it inside an HTML Element first.