Implementing JavaScript functionality based on a specific body class

Is there a way to execute this script only on a specific page with a particular body class? For example, if the page has

<body class="category-type-plp">

How can I target my script to work specifically for "category-type-plp"?

plpSpaceRemove: function() {

    $(document).ready(function() {
          if ($('.bv-tile.bv-inline-rating-outer').length % 4 === 0) {
            for (let i = 0; i < ($('.bv-tile.bv-inline-rating-outer').length / 4); i++) {
              let remove = true;
              $('.bv-tile.bv-inline-rating-outer').slice(i * 4, 4 * (i + 1)).each(function() {
                  if ($(this).find(".bv-stars-wrap

                      ").length != 0) {
                      remove = false;
                    }
                  });
                if (remove) {
                  $('.bv-tile.bv-inline-rating-outer').slice(i * 4, 4 * (i + 1)).each(function() {
                      if ($(this).find(".bv-stars-wrap

                          ").length === 0) {
                          $(this).css("display", "none");
                        }
                      });
                  }
                }
              }
              else {
                for (let i = 0; i < ($('.bv-tile.bv-inline-rating-outer').length / 3); i++) {
                  let remove = true;
                  $('.bv-tile.bv-inline-rating-outer').slice(i * 3, 3 * (i + 1)).each(function() {
                        if ($(this).find('.bv-stars-wrap

                            ').length != 0) {
                            remove = false;
                          }
                        });

Answer №1

One way to determine if your body element contains a specific class is by checking with the following code:

if (!$('body').hasClass('some-class')) return;

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Even after being removed from the DOM using Ajax load, JQuery continues to execute

Currently, within my Laravel 5.2 single page application development, I am faced with the following issue. I have an add.blade.php file and an edit.blade.php file, both containing a script with the same class name and id. When I use .load to load add.blade ...

Create beautiful PDF documents using the KNP Snappy Bundle, seamlessly converting dynamically modified Twig templates

Currently, I am attempting to create a PDF from a tweaked Twig on the client side. My approach involves sending the modified HTML document to the server via AJAX. However, this method is proving ineffective as the server is returning a binary document that ...

The JSON.stringify method may not accurately reflect the original object that was converted into a string

Working on a Connect Four app for my school project has been an interesting challenge. At the moment, I am grappling with JSON.stringify and trying to encode an object that holds a two-dimensional array of "hole" objects to eventually send it to the server ...

React.js, encountering unusual behavior while implementing a timer

I'm currently working on a React project to create a basic timer. The start button should initialize the timer, while the stop button should pause it. However, I've encountered some unexpected behavior. When I click on start for the first time, ...

How to retrieve the width of an unspecified element using JavaScript

Seeking help with a div element that adjusts its size based on the elements it contains. How can I determine the final size of this dynamic div without checking the sizes of its internal elements? I've attempted to parse all the properties of the obj ...

Angular 6 and the intricacies of nested ternary conditions

I need help with a ternary condition in an HTML template file: <div *ngFor="let $m of $layer.child; let $childIndex=index" [Latitude]="$m.latitude" [Longitude]="$m.longitude" [IconInfo]="$childIndex== 0 ? _iconInfo1:$c ...

The style of MUI Cards is not displaying properly

I've imported the Card component from MUI, but it seems to lack any styling. import * as React from "react"; import Box from "@mui/material/Box"; import Card from "@mui/material/Card"; import CardActions from "@mui/m ...

Converting a single 10GB zip file into five separate 2GB files with the help of NodeJS

var fs = require('fs'); var archiver = require('archiver'); var output = fs.createWriteStream('./test.zip'); var archive = archiver('zip', { gzip: true, zlib: { level: 9 } // Sets the compression level. }); ...

The video is not appearing on mobile devices using Safari, Firefox, and Chrome, but it is displaying properly on desktop computers

My website has a video in the header that works fine on desktop but not on mobile. I am using next.js 13.4 and here is my code: <video id="background-video" autoPlay playsInline loop muted classN ...

Tips for utilizing an npm package in conjunction with Hugo

I created a basic hugo site with the following command: hugo new site quickstart Within the layouts/_default/baseof.html file, I have included a JavaScript file named script.js. Inside script.js, the code looks like this: import $ from 'jquery' ...

Updating a nested document within an array - Utilizing MongoDB with the Node.js driver

I am struggling to achieve the following task: locate a document with a specific id, then find the corresponding document in the legacy array based on a shortID, and update the sets array of that matched embedded document. For some reason, I can't se ...

How jQuery manipulates the DOM during a drag-and-drop operation

My current challenge involves implementing jquery-ui sortable on items that appear while scrolling. Below is the code snippet I am using: var gridTop = 0, gridBottom = container.outerHeight(); $('#play-list').on('scroll', ...

Which is better: specifying Node.js version with nvmrc or in package.json engines

Ensuring that other developers working on my JavaScript project use specific versions of node and npm is important to me. I recently added the following code snippet to my package.json file: "engineStrict" : true, "engines": { "node" : "10.10.0", ...

Is a Selenium loop a viable option?

</head> <body> <table cellpadding="1" cellspacing="1" border="1"> <thead> <tr><td rowspan="1" colspan="3">test</td></tr> </thead><tbody> <tr> <td>click& ...

Leveraging a fetch request response in componentDidMount to power a subsequent request within a React-Redux component

I am currently facing a challenge with a component that triggers a fetch request (in redux) on componentDidMount. I now need to make another fetch request in the same component using the response data from the first fetch, and ideally before rendering. Si ...

Creating a jQuery alertbox that is triggered by specific elements in an anchor tag

I am working on an HTML page that contains 50 A tags. I am trying to figure out how to create an alert based on a specific element inside the A tag. Here is an example of what I am looking for: <a href "something">click to see the alert</a> ...

Swap the content of one div with another div using client-side code only

Currently, I am in the process of developing my personal website. To enhance user experience, I have implemented a vertical navigation bar on the left side of the page. My goal is to replace the content of a specific div with content from other HTML files ...

Identify a CSS style or attribute that is being dynamically assigned using JavaScript

While using the Jquery Cycle plugin for my slideshow, I'm looking to trigger an event when a specific slide is active. The Cycle plugin handles this by adjusting the opacity of images within a div in this manner: <div style="position: absolute; to ...

Tips for simulating a service in Angular unit tests?

My current service subscription is making a promise: getTaskData = async() { line 1 let response = this.getTaskSV.getTaskData().toPromise(); line 2 this.loading = false; } I attempted the following approach: it('should load getTaskData', ...

Organize group data by month in a visually appealing table using HTML/PHP with

I have successfully implemented a code that prints HTML table rows from a database table and sorts them by date. The challenge lies in the fact that the date is stored as VARCHAR (due to a pre-existing project with an active database used in a PHP web app ...