1. Advertising
    y u no do it?

    Advertising (learn more)

    Advertise virtually anything here, with CPM banner ads, CPM email ads and CPC contextual links. You can target relevant areas of the site and show ads based on geographical location of the user if you wish.

    Starts at just $1 per CPM or $0.10 per CPC.

Please help me and ChatGPT to rewrite this Javascript Function

Discussion in 'JavaScript' started by ColinK, Jul 18, 2023.

  1. #1
    Hi

    I have wasted several hours with ChatGPT trying to get a JavaScript Function to work. I would appreciate your help.

    Note I am a "Copy and Paste" coder so have limited skills in fixing ChatGPT errors.

    The function copied below correctly finds and formats matching pairs of words in boxes 2 to 5 that exist in box1
    Box1 contains HTML Text
    Boxes 2 to 5 contain one string per line enclised in <div>'s

    eg
    Following two strings are in box 1 and 2
    "two words"
    "this is four words"
    (it correctly finds and formats the above as pairs)
    but when the following is in box 2 and box 1
    "something Two Words"
    it only formats "two words"
    I am not sure why it does not choose "something two". (though not important, iif following is sorted)

    In any case I would like to modify it so that it finds and formats "2 or more" matching words as a string
    eg if the following is in box1 (as html)
    "this is Five Words total plus something else"
    and the following is in box2 (in a Div, unformatted - bold below is just to highlight matching string)
    "anything this is five words total and more"
    it should format "this is five words total" leaving the other words unformatted.

    It already ignores case

    Any help in rewriting the function below would be appreciated

    Note - there may be unnecessary fluff in the function below
    
    function find2Words() {
    // Modified version should find matching strings of 2 words+
    const box1 = document.getElementById("box1");
    const boxes = document.querySelectorAll("#box2, #box3, #box4, #box5");
    
    const box1Text = box1.innerText.replace(/\n/g, " ");
    const box1Words = box1Text.match(/\b\w+\b/g);
    
    boxes.forEach((box) => {
    const lines = Array.from(box.getElementsByTagName("div"));
    
    lines.forEach((line) => {
      const lineText = line.innerText;
      let formattedLine = lineText;
    
      for (let i = 0; i <= box1Words.length - 2; i++) {
        const phrase = box1Words.slice(i, i + 2).join(" ");
    
        if (lineText.toLowerCase().includes(phrase.toLowerCase())) {
          const regex = new RegExp(`\\b${phrase}\\b`, "gi");
          formattedLine = formattedLine.replace(regex, `<span style="color: #873600;">$&</span>`);
        }
      }
    
      line.innerHTML = formattedLine;
    });
    });
    }
    Code (JavaScript):
     
    Last edited by a moderator: Jul 18, 2023
    ColinK, Jul 18, 2023 IP
  2. sarahk

    sarahk iTamer Staff

    Messages:
    28,690
    Likes Received:
    4,496
    Best Answers:
    123
    Trophy Points:
    665
    #2
    codepen is your friend for setting up tests and working on code.
     
    sarahk, Jul 18, 2023 IP
  3. ColinK

    ColinK Peon

    Messages:
    4
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    1
    #3
    Thanks for the suggestion. I tried Codepen but as I thought it did not give me any suggestions to modify the script. Due to my limited skills I need a better AI than Chat GPT or human help. Hence why I posted here.
     
    ColinK, Jul 19, 2023 IP
  4. sarahk

    sarahk iTamer Staff

    Messages:
    28,690
    Likes Received:
    4,496
    Best Answers:
    123
    Trophy Points:
    665
    #4
    Yep, but when you share your codepen other people can edit it and share it back here to show you it working. It saves people a step and makes them more likely to help. I don't understand what you're trying to do so seeing the form would make it easier.
     
    sarahk, Jul 19, 2023 IP
  5. ColinK

    ColinK Peon

    Messages:
    4
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    1
    #5
    @sarahk Thanks for explaining how CodePen can help others to help me. I missed that.
    I think I have correctly added my code and and script with suitable examples and explanation.

    Hopefully this better explains my issue
    The script currently finds pairs of words (2,4,6 etc) that are in boxes 2 to 5 that are an exact match for a string of two words in box1
    It should find all matching strings of two or more matching words

    https://codepen.io/ColinK2/pen/vYQaJjx
     
    ColinK, Jul 22, 2023 IP
  6. ColinK

    ColinK Peon

    Messages:
    4
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    1
    #6
    Any help with this would be appreciated
     
    ColinK, Jul 29, 2023 IP