jQuery: Modifiers

November 23, 2018

Some notes and examples on some of the most common jQuery modifiers

Table of Contents

.text()
.html()
.attr()

Here are some notes and examples on some of the most common jQuery modifiers:

.text()

This is very similar to the vanilla JS .textContent property. The full documentation for .text() is here.

It will either retrieve the text content of the selected element or change it if you add new text in the brackets. So for example:

this is the first h1 on this doc

Now if I want to change the first h1 we can pass the text that we would like into the .text method:

.html()

This works just like the vanilla JS method .innerHTML. Meaning that we will return all of the html in the selected tag, not just the text content. We can also replace all of the html. jQuery docs are available for this here.

.attr()

jQuery Docs Here.

Allows you to get and set the attributes of an object, for example changing the alt text on an image.

.attr() takes two arguments, a getter and a setter. If you do not use the second argument it will simply return the current value of the requested attribute. For example

$("img").attr("src")

Will return the current source of the selected image. But if you use the second attribute:

$("img").attr("src","https://www.ngoughlin.com/image2.jpg")

Will change whatever the image src was to this new image hosted on my website. This changes the picture.

Comments

Recent Work

Basalt

basalt.software

Free desktop AI Chat client, designed for developers and businesses. Unlocks advanced model settings only available in the API. Includes quality of life features like custom syntax highlighting.

Learn More

BidBear

bidbear.io

Bidbear is a report automation tool. It downloads Amazon Seller and Advertising reports, daily, to a private database. It then merges and formats the data into beautiful, on demand, exportable performance reports.