1. This website uses cookies to improve service and provide a tailored user experience. By using this site, you agree to this use. See our Cookie Policy.
    Dismiss Notice

Some Javascript help - getElementById

Discussion in 'HTML & JavaScript' started by Scorpion Ghost, Apr 29, 2020.

  1. Scorpion Ghost

    Scorpion Ghost Jr. VIP Jr. VIP

    Joined:
    Mar 22, 2013
    Messages:
    3,273
    Likes Received:
    1,512
    Occupation:
    Internet!
    Location:
    On the Interwebz
    Home Page:
    So I was looking for a way to execute javascript in a browser on demand, unlike Greasemonkey which monitors pages and only executes after page refresh.

    So I discovered bookmarklets, and they're awesome, I love it.

    But I'm no javascript expert, and now I have a problem which should be an easy fix, but I can't figure it out.

    We have code I need clicked:

    HTML:
    <a id="action_limit_4927258" onclick="actionlimit(4927258)" href="#/">Action</a>
    <a id="action_limit_4927123" onclick="actionlimit(4927123)" href="#/">No Action</a>
    <a id="action_limit_4927789" onclick="actionlimit(4927789)" href="#/">Action</a>
    We have Javascript that works:

    Code:
    javascript: document.getElementById("action_limit_4927258").click();
    javascript: document.getElementById("action_limit_4927123").click();
    javascript: document.getElementById("action_limit_4927789").click();
    So my problem is that the numbers there change - e.g 4927789 - and from my research it's not possible to use Wildcards* in the getElementById code.

    I would even be okay to use the "Action" and "No Action" bits as selectors, whatever works.

    Can anyone help?
     
    Last edited: Apr 29, 2020
  2. IYASS

    IYASS Junior Member

    Joined:
    Jun 30, 2018
    Messages:
    161
    Likes Received:
    147
    Gender:
    Male
    Hello,

    I'm not sure if it's gonna work with bookmarklets but you can make a function like this:

    Code:
    <a id="action_limit_4927258" onclick="actionLimit(4927258)" href="#/">Action</a>
    <a id="action_limit_4927123" onclick="actionLimit(4927123)" href="#/">No Action</a>
    <a id="action_limit_4927789" onclick="actionLimit(4927789)" href="#/">Action</a>
    
    function actionLimit(number) {
        document.getElementById("credit_limit_" + number).click();
    }
     
    • Thanks Thanks x 1
  3. kn1ves

    kn1ves Jr. VIP Jr. VIP

    Joined:
    Aug 25, 2018
    Messages:
    685
    Likes Received:
    1,077
    Gender:
    Male
    Occupation:
    Internet Marketer
    Location:
    Wammy's House
    Home Page:
    If the id's are dynamically generated you would be better off using either Xpath, Tagname or CSS Selectors.

    Hint: Check if you can select the parent element by classname.
     
    • Thanks Thanks x 1
  4. Scorpion Ghost

    Scorpion Ghost Jr. VIP Jr. VIP

    Joined:
    Mar 22, 2013
    Messages:
    3,273
    Likes Received:
    1,512
    Occupation:
    Internet!
    Location:
    On the Interwebz
    Home Page:
    Tried it, didn't work.

    Well yeah I can probably select the parent element by classname, but how would that change anything? The IDs are still dynamic.

    I don't see any unique CSS, and I'm not sure if Xpath would work with bookmarklets, and I'm not sure what you mean by Tagname :/

    Well according to this Xpath would work in bookmarklets - https://stackoverflow.com/questions...with-xpath-from-current-page-as-url-arguments

    But how would I implement it, what code to use? I'll google it, but if you can tell me would be great.
     
  5. kn1ves

    kn1ves Jr. VIP Jr. VIP

    Joined:
    Aug 25, 2018
    Messages:
    685
    Likes Received:
    1,077
    Gender:
    Male
    Occupation:
    Internet Marketer
    Location:
    Wammy's House
    Home Page:
    Try using this:
    Code:
    document.querySelectorAll('.className > a')
    Replace className with the parent's class.

    Store this in a variable and then use indexing to access the element or do whatever you need to with it.

    For example:
    Code:
    var x = document.querySelectorAll('.className > a');
    
    x[0].innerText should return Action
    
    or
    
    x[0].click()
     
  6. Scorpion Ghost

    Scorpion Ghost Jr. VIP Jr. VIP

    Joined:
    Mar 22, 2013
    Messages:
    3,273
    Likes Received:
    1,512
    Occupation:
    Internet!
    Location:
    On the Interwebz
    Home Page:
    Well, I tried this and it didn't work:

    Code:
    javascript: var x = document.querySelectorAll('.blue-line > a')[0].click();
    That's not what you meant right? I mean, I don't see how it would. The class is there, but it doesn't define which button to click on. And I may have formatted it incorrectly too.

    Sorry, I'm not very good with javascript and all that.
     
  7. kn1ves

    kn1ves Jr. VIP Jr. VIP

    Joined:
    Aug 25, 2018
    Messages:
    685
    Likes Received:
    1,077
    Gender:
    Male
    Occupation:
    Internet Marketer
    Location:
    Wammy's House
    Home Page:
    Can you give the HTML of the parent element along with the <a> tags? (Right click and view page source)
     
    • Thanks Thanks x 1
  8. IYASS

    IYASS Junior Member

    Joined:
    Jun 30, 2018
    Messages:
    161
    Likes Received:
    147
    Gender:
    Male
    Post or send me the full code I can't make it work without it :)
     
    • Thanks Thanks x 1
  9. IYASS

    IYASS Junior Member

    Joined:
    Jun 30, 2018
    Messages:
    161
    Likes Received:
    147
    Gender:
    Male
    Okay, it didn't work because we need to add the number in ' '

    this should work:

    Code:
    <a id="action_limit_4927258" onclick="actionLimit('4927258')" href="#/">Action</a>
    <a id="action_limit_4927123" onclick="actionLimit('4927123')" href="#/">No Action</a>
    <a id="action_limit_4927789" onclick="actionLimit('4927789')" href="#/">Action</a>
    
    function actionLimit(number) {
        document.getElementById("action_limit_" + number).click();
    }
    But I'm not sure why you want the button to be clicked twice.
    Do you realize that when the button is clicked you will call .click again so the button will be clicked twice?
     
    • Thanks Thanks x 1
    Last edited: Apr 29, 2020
  10. Scorpion Ghost

    Scorpion Ghost Jr. VIP Jr. VIP

    Joined:
    Mar 22, 2013
    Messages:
    3,273
    Likes Received:
    1,512
    Occupation:
    Internet!
    Location:
    On the Interwebz
    Home Page:
    Guys the full code is like a bajillion lines. And if I go a few lines higher, the IDs are still dynamic.

    I'll PM you both the site and tell you how to see the situation, and if you have a minute and feel like it, see what can be done.

    That still doesn't work. I mean, as far as I can see that's the exact same code you previously gave me. And I tried wrapping the number in ' ' and in " " , but no luck.

    Actually at times there could be 3 or 5 or more identical buttons, and I'd like to click a bookmarklet once and have it click all of them (versus me having to click them one by one to expand them :) )
     
  11. Scorpion Ghost

    Scorpion Ghost Jr. VIP Jr. VIP

    Joined:
    Mar 22, 2013
    Messages:
    3,273
    Likes Received:
    1,512
    Occupation:
    Internet!
    Location:
    On the Interwebz
    Home Page:
    Problem solved. Many thanks :)
     
    • Thanks Thanks x 2