reading-notes

Class 201.09

Notes

<form>
  <fieldset>
    <legend>Create a Pokemon</legend>
    <label for="pokemon-name">Pokemon Name</label>
    <input id="pokemon-name" type="text" name="" placeholder="Pikachu">
  </fieldset>
</form>

Readings

HTML Forms

  1. Why are forms so important in web development?

    they allow us to capture feedback from users/customers/etc.

  2. When designing a form, what are some key things to keep in mind when it comes to user experience?

    prioritize simplicity and clarity, use clear labels and instructions, and implement real-time validation with informative error messages. ensure the form is mobile-friendly, follows logical ordering, and provides visual cues for feedback, creating an accessible and user-friendly interface.

  3. List 5 form elements and explain their importance.

    <label>: Important for associating a text label with form elements, improving accessibility and user experience.

<input>: Essential for capturing user input in various forms, such as text, numbers, checkboxes, radio buttons, etc.

<textarea>: Crucial for accepting multi-line text input, allowing users to provide more detailed information.

<button>: Vital for creating clickable elements to trigger actions within a form or on a web page.

<form>: A fundamental container for organizing and handling form elements, enabling data submission to a server or client-side processing.

Learn JS

  1. How would you describe events to a non-technical friend?

    events are the things that happen on a webpage that comes from the user (a click, resize, video played/paused, hover over somethings, etc.)

  2. When using the addEventListener() method, what 2 arguments will you need to provide?

    (eventWeListenFor, functionWhenEventHappens)

    • event’s include:
      • click: when user clicks
      • focus and blur: when a field/button is focused or not
      • dlbclick: ;)
      • mouseover and mouseout: when the mouse hovers over, or moves away from the button/thing
  3. Describe the event object. Why is the target within the event object useful?

    inside an event handler function, you’ll see a parameter specified with a name such as event, evt, or e. This is called the event object, and it is automatically passed to event handlers to provide extra features and information. the “target” property within the event object is particularly useful because it allows you to identify the exact element that triggered the event. This information is valuable when dealing with events that can be triggered by multiple elements, such as click or submit events on various buttons or form inputs. With the “target” property, you can easily access and manipulate the specific element that initiated the event, enabling dynamic and interactive web page behavior

  4. What is the difference between event bubbling and event capturing?

    Event bubbling describes how the browser handles events targeted at nested elements. the event bubbles up from the innermost element that was clicked. Event bubbling is the default behavior in most modern browsers. event bubbling moves from the target element up to the root, while event capturing moves from the root down to the target.

Q&A’s

References

This site is open source. Improve this page.