Learn

JSX elements can have attributes, just like HTML elements can.

A JSX attribute is written using HTML-like syntax: a name, followed by an equals sign, followed by a value. The value should be wrapped in quotes, like this:

my-attribute-name="my-attribute-value"

Here are some JSX elements with attributes:

<a href='http://www.example.com'>Welcome to the Web</a>;

const title = <h1 id='title'>Introduction to React.js: Part I</h1>;

A single JSX element can have many attributes, just like in HTML:

const panda = <img src='images/panda.jpg' alt='panda' width='500px' height='500px' />;

Instructions

Declare a constant named p1.

Set p1 equal to a JSX  element. Write the word foo in between the  tags.

On the next line, declare a constant named p2.

Set p2 equal to another JSX  element. Write the word bar in between the  tags.

Give the first  an id attribute of 'large'.

Give the second  an id attribute of 'small'.

Take this course for free

By signing up for Codecademy, you agree to Codecademy's Terms of Service & Privacy Policy.

Or sign up using:

Already have an account?