Section 1 - Selectors

    //boiler
    <html>
    <head>

    </head>
    <body>
        <h1 id ="title"> title </h1>
        <p class="paragraph">Paragraph text 1 </p>
        <p class="paragraph">Paragraph text 2 </p>

        <input type="text"></input>
        <ul>
            <li>List element 1 </li>
            <li>List element 2 </li>
            <li>List element 3 </li>
            <li>List element 4 </li>
            <li>List element 5 </li>
        </ul>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
        <script src="app.js"></script>
    </body>                                            
    </html>

Selectors

  • Invoke jquery function -> $()

    • Takes a selector

    • $('selector')

  • Work like css elements

    • . for class

    • for id, etc

classList element 4

  • Specify selectors further by chaining selectors.

  • List element 1

  • List element 2

  • List element 3

  • List element 4

  • List element 5

  • List element 1

  • List element 2

  • List element 3

  • List element 4

  • List element 5

  • Selectors by the attribute tag directly:

  • Also have the option of specifying attribute tags like this

  • Selectors as inverses

  • Shortcuts: selecting all children of a selector

  • List element 1

  • List element 2

    Paragraph text 1

    Paragraph text 2

  • List element 3

  • List element 4

  • List element 5

Last updated

Was this helpful?