Skip to content
  • Categories
  • Recent
  • Tags
  • Popular
  • Users
  • Groups
  • Search
  • Get Qt Extensions
  • Unsolved
Collapse
Brand Logo
  1. Home
  2. Qt Development
  3. QtWebEngine
  4. How to use getElementsByClassName with WebEngine runJavascript
Forum Updated to NodeBB v4.3 + New Features

How to use getElementsByClassName with WebEngine runJavascript

Scheduled Pinned Locked Moved Unsolved QtWebEngine
3 Posts 2 Posters 591 Views
  • Oldest to Newest
  • Newest to Oldest
  • Most Votes
Reply
  • Reply as topic
Log in to reply
This topic has been deleted. Only users with topic management privileges can see it.
  • U Offline
    U Offline
    Uzosky
    wrote on last edited by
    #1

    Hello,
    I'm having a problem modifying the content of HTML document using getElementByClassName or getElementById. My code is not generating error except when there is an error in the code, but it's not working either. Here is the relevant part of my code that is not working:

    WebEngineView {
           id: webviewer
           anchors.fill: parent
           url: "https://developer.mozilla.org/en-US/"
           opacity: 1
           visible: true
    }
    
    
    Connections {
       target: webviewer
           onLoadingChanged: {
       	if (WebEngineLoadRequest.LoadSucceededStatus)
       		webviewer.runJavaScript("var Elem = document.getElementsByClassName('highlight-span'); Elem.innerHTML = 'Hello!'";)
    }
    

    But when I target a specific HTML element with 1 line of code, it works.

    webviewer.runJavascript("document.body.innerHTML = 'Hello!' ")
    

    Is it that runJavascript doesn't understand 2 lines of code? Or getElementsByClassName?
    Please what am I doing wrong here?

    JonBJ 1 Reply Last reply
    0
    • U Uzosky

      Hello,
      I'm having a problem modifying the content of HTML document using getElementByClassName or getElementById. My code is not generating error except when there is an error in the code, but it's not working either. Here is the relevant part of my code that is not working:

      WebEngineView {
             id: webviewer
             anchors.fill: parent
             url: "https://developer.mozilla.org/en-US/"
             opacity: 1
             visible: true
      }
      
      
      Connections {
         target: webviewer
             onLoadingChanged: {
         	if (WebEngineLoadRequest.LoadSucceededStatus)
         		webviewer.runJavaScript("var Elem = document.getElementsByClassName('highlight-span'); Elem.innerHTML = 'Hello!'";)
      }
      

      But when I target a specific HTML element with 1 line of code, it works.

      webviewer.runJavascript("document.body.innerHTML = 'Hello!' ")
      

      Is it that runJavascript doesn't understand 2 lines of code? Or getElementsByClassName?
      Please what am I doing wrong here?

      JonBJ Offline
      JonBJ Offline
      JonB
      wrote on last edited by JonB
      #2

      @Uzosky
      getElementsByClassName(), as the name suggests, returns a list/multiple elements, doesn't it? (Not the same as e.g. getElementById(), which returns one.) So when you assign that to variable Elem, you cannot go Elem.innerHTML on a list/array. You will want more like:

      webviewer.runJavaScript("var elems = document.getElementsByClassName('highlight-span'); for (var i = 0; i < elems.length; i++) { elems[i].innerHTML = 'Hello!'"; })
      
      U 1 Reply Last reply
      3
      • JonBJ JonB

        @Uzosky
        getElementsByClassName(), as the name suggests, returns a list/multiple elements, doesn't it? (Not the same as e.g. getElementById(), which returns one.) So when you assign that to variable Elem, you cannot go Elem.innerHTML on a list/array. You will want more like:

        webviewer.runJavaScript("var elems = document.getElementsByClassName('highlight-span'); for (var i = 0; i < elems.length; i++) { elems[i].innerHTML = 'Hello!'"; })
        
        U Offline
        U Offline
        Uzosky
        wrote on last edited by
        #3

        @JonB Thank you for coming to the rescue again.

        1 Reply Last reply
        1

        • Login

        • Login or register to search.
        • First post
          Last post
        0
        • Categories
        • Recent
        • Tags
        • Popular
        • Users
        • Groups
        • Search
        • Get Qt Extensions
        • Unsolved