0

although I'm a programming-noob, ... I am making a google extension to parse multiple webpages with forum threads under each other. I also want to hide the header/footers of all webpages (except for the header of the first webpage and the footer of the last webpage).

The code for parsing the webpages under each other is working (using objects of type "text/html". The code to hide the header/footer of the 'main/first' webpage is also working.

However I don't know how I can get my hide-functions to work for the html pages inside the objects of type "text/html". How do I select the elements of the webpages inside the new objects. Can I use a function that applies to these webpage-objects?

I would also like object.style.height be sized automatically so the complete page is shown. I can't get this to work (tried 100%, auto) so I have it currently set on "2500px". Any ideas? 100% results in a very small height.

I tried some document.getElementByID('website1').getElementByID('page-footer').style.display = "none"; To select an element inside the html-object but this didn't work. I now ... don't really know where to start.

manifest.json

{
  "manifest_version": 2,
  "name": "  Schifters tool",
  "permissions": [ "tabs", "activeTab", "storage" ],
  "version": "0.1.0",
      "icons": {
      "128": "images/Schifters.png",
      "16": "images/Schifters-16x16.png",
      "32": "images/schifters-32x32.png"
   },
   "description": "  Schifters Tool",
   "content_scripts": [
    {
      "matches": [
        "https://schifters.be/viewforum.php*"
      ],
      "js": ["content.js"]
    }
  ]
}

content.js

var numerOfPages = 4;
var url;   
var websiteID = "website";

 function create(website, page) {
    var website;  
    var page;
    var para = document.createElement("p");
    var object = document.createElement('object');       

    object.type = "text/html";
    object.data = website;
    object.align = "center";
    object.id = websiteID.concat(page); "website";
    object.style.width = "100%";
    object.style.height = "2500px";

    var node = document.createTextNode("");
    para.appendChild(node);
    document.body.appendChild(para);  
    document.body.appendChild(object);
    document.body.appendChild(para);
}

function hideFooter(){
 document.getElementById('schifters_google_adsense_footer').style.display = "none"; 
// and some other elements to hide... 
}

function hideHeader(){
 document.getElementById('schifters_google_adsense_header').style.display = "none";  
// and some other elements to hide... 
}

/create multiple html pages under each other
for (i = 1; i < numerOfPages ; i++){
 url = ("https://schifters.be/viewforum.php?f=4&start=");
 url = url.concat(i * 24);
 create(url, i);
}

// hide header and footer on main page
hideFooter();
hideHeader();
OldEvil1
  • 19
  • 3
  • Just some terminology clarification for you. The items in a web page aren't *objects of type "text/html"*, they are Document Object Model (or just DOM) objects. I think what you are asking is how to select a DOM object? And there are many possible ways to do that depending on how you'd like to search (by ID if available, by CSS selector, by position in the document or relative to other elements). You should narrow your question to something more specific. – Scott Marcus Aug 27 '19 at 18:18
  • @Scot (sorry for my bad terminology - that's what you get when your programming knowledge is mainly the result from googling). I know how to select a DOM object. That's what I do in the code with ```document.getElementById('schifters_google_adsense_header')``` or ```document.querySelector('[class="stat-block online-list"]')```. However I am creating a 'new' object in this DOM that contains again a full webpage. And I want to select items in this 'DOM within a DOM'? – OldEvil1 Aug 27 '19 at 18:34
  • *However I am creating a 'new' object in this DOM that contains again a full webpage.* <-- No, sorry, you're not. A DOM can't contain a DOM. – Scott Marcus Aug 27 '19 at 18:35

0 Answers0