Question 257024 in Jquery Question posted in
The official Jquery Api Documentation can be found here.

Jquery – Trying to identify a specific element for a website extension

I’m currently trying to write an extension for chrome for a website to have some QoL upgrades, however I’m basically brand new when it comes to coding and having a lot of trouble trying to identify a specific element on the site. There’s more that needs to be done after that but at this point I’m just trying to make sure I can actually grab it and print something to console to verify it’s been pulled.

So this is my current code:

function replaceCheck() {
    const elements = document.querySelectorAll(".wl-item.dropdown-item.added > a");
  
    elements.forEach((element) => {
      if (element.textContent.includes("Completed")) {
        console.log("Successfully Identified");
      }
    });
  }

With this I’m trying to grab the following element from a site:
Image of website element

The problem is is that nothing is printing to console when I run it, I need the code to include the "Completed" string as there are other possible strings depending on the option a user selects from a drop down.

Now for some additional clarification, I learned javascript self taught like 6 years ago now and never actually used it for anything really, so I basically have no idea what I’m doing at this point. This code was originally written up with the help of AI to get a starting point and tweaked it from there so this code could be completely incorrect in every way just trying to get an idea at this point.

Tags:

2

Answers


  1. 0

    you are trying to find the tag inside the a tag, try removing the "> a" because the ".wl-item.dropdown-item.added" is already it

    Login or Signup to reply.
  2. 0

    Consider the following.

    function replaceCheck() {
  var elements = document.querySelectorAll("a.wl-item.dropdown-item.added");
  var result = false;
  elements.forEach((element) => {
    if (element.innerText.search("Completed") >= 0) {
      console.log("Successfully Identified");
      result = true;
    }
  });
  return result;
}

    Using textContent might be more aggressive then you need. I used innerText property.

    The textContent property sets or returns the text content of the specified node, and all its descendants.

    Versus:

    The innerText property sets or returns the text content of an element.

    It’s not clear, as you didn’t provide a complete example, how you are using or calling the function, so I am assuming it may be used in a logical statement.

    Search will returns the index (position) of the first match or -1 if not found. This example is case sensitive, so it must match "Completed" exacly.

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search