How can i find source of html - javascript

I want to know form where page loads html...
For example, in my developing page I find this code
<div id="dnn_NavPane"><a name="alo"></a>
<table width="100%" cellspacing="0" cellpadding="0" border="0">
//some code here
</table>
</div>
In sources I find that .ascx file, in which I see only this
<div runat="server" id="NavPane"></div>
So I about 2 hours can't find from where he feel div with that content? How can I find that code?
Here they used DotNetNuke and maybe secret is in that? Who can help?

When your DotNetNuke skin has a <div /> that is runat=server, that gets transformed into a "pane." DotNetNuke allows you to add modules to the pane, so you'd need to see what module is in there to see how its markup is being generated. It will probably be somewhere in the website's DesktopModules folder, and you can look it up in the "Module Definitions" or "Extensions" page (depending on the version of DNN) to see more information about a module.
If you don't have access to the running website, the assignment of a module to a pane is stored in the database. You'll want to find the page in the Tabs table, then check the entries in the TabModules table to see what module is in that pane on that tab. From there, follow TabModules to Modules to ModuleDefinitions to ModuleControls to see which control is generating the markup.

If they are using DotNetNuke then the content is being dynamically generated.
You can only see <div runat="server" id="NavPane"></div> because the content is dynamically being added to this.
I you want to edit the html, then you will need to edit it through the DotNetNuke Content Management System.

you know that server id of the element is NavPane. Go to codebehind and track all the operations with that control. try to work out when the inner html is assigned. Then attach to server process, make breakpoints there and see in debugger what happens.
Here they used DotNetNuke and maybe secret is in that?
maybe :) if you don't know how the underlying layer works the complexity of your task grows sufficiently

Related

Is there a vanilla JavaScript technique for dynamically inserting common code into HTML pages, similar to PHP's include capability?

I have a multi-page HTML site with common code that is reused on each page (for example, navbar code, Analytics, stylesheet imports, etc).
Is there a way to dynamically insert that common code in a manner that achieves the same result as PHP's include capability, and makes the code easier to maintain?
I've seen similar questions but not all seem to speak to what I want to achieve with the site I am working with. For example:
How to inject HTML banner code using Vanilla Javascript? - Stack Overflow
Important: Much of the code I want to insert/import will be <header> code that is necessary to properly render the pages so it will need to be inserted as the page loads.
Any suggestions? Please limit suggestions to vanilla JavaScript. I don't know JQuery at this point and want to try do this with JS.
There are a handful of ways to do what you want, but I think a template engine such as EJS or similar will meet your needs.
Do keep in mind though the implications of doing this client-side. Crawlers and such that don't run JavaScript won't have the benefit of seeing what's supposed to be on your page.
What you should probably be doing instead is running these JavaScript templates server-side, outputting static pages which then can be put on your web server or CDN.
Webpack? You could use a packaging system to fuse all your JS into one file, same for CSS. That way you have only only script and one link to add to each page. But for HTML parts, they would be added with javascript ajax and that shouldn't be a solution...
Why would you have multiple pages at all? Cant you just have one page, then update a certain ( the main part) part of your page with new code content instead of a redirect. ( if you want to see this in action visit http://google.com, http://twitter.com and many many more ). the index.html would then look like this:
<body>
<div id = "nav" >
<a href = "/whatever.html" class = "redirect" > Whatever </a>
</div>
<div id = "main" >
Some content
</div>
<script>
//embed jquery
$(_ => {
$(".redirect").on("click",function(e){
e.preventDefault();
$("#main").load(this.href);
});
});
</script>

How to start script in HTML without <script> tag?

I'm using a low-code development platform called WaveMaker right now, and it gives you the option to customize the "markup" of the page (HTML, but you can't really edit <head>; the whole thing is kind of weird), the Javascript of the page, particularly with events like onpageload, etc., the style of the page (CSS), and the page's variables (JSON). I'm trying to embed Formstack forms, but every time the Markup section encounters a <script> tag, it deletes everything after the end of the tag. This is what the markup page looks like. I contacted support and they seemed to indicate that this was on purpose. Is there any way to make HTML run script included in-line without saying <script>? PS: I would be able to embed using iFrames, but for some reason the iFrames aren't working on the iPhone test program, even though they're working on the simulator.
What you can do is put it inside an HTML event attribute.
<body onload="/*your JS here*/">
</body>
If that does not work, try attaching onload to another HTML element or try one of the other event handlers (though I believe that they should have taken this into account as well)
How about this :
<body onload="javascript:(function(){
// you can place your code here it should run
alert('ok')
})()">
</body>
In Avatao's Senior Web Security Career Path, there is a hacking task, where you need to insert malicious javascript code - but the <script> is tag filtered (other tags aren't). Aenadon's answer gived me one solution:
<body onload="your JS here"> </body>
After submitting that, I checked the official solution, and I found that:
<img src="x" onerror=alert('xss')>

Bind HTML Attribute to XML Data Source

I am not that familiar with the whole SGML family... I need to develop a small website which is part of an installation process of an application. The website shows permanently the features which were selected during the installation process. The website is fine - thanks to Bootstrap. But now I want to hide or show elements on this website according to the selection in the installation process.
During the installation I can modify an XML file. My idea is to bind the HTML attributes to the XML data.
Example XML I can modify during my installation process:
<features>
<feature>
<name>Feature 1</name>
<visible>hidden</visible>
<feature>
<features>
HTML idea:
<div class="feature1" VISIBLE_VALUE_FROM_XML>
<img src="./img/feature1"/>
</div>
Is it somehow possible to bind both? What are the relevant keywords here? What alternatives do I have? Do you have any good reading sources?
Thanks!
[EDIT]:
Perhaps the question was too trivial for you. I guess I was too limited in Data Binding thinking. So, the following steps do the trick:
leave your desk
grab a coffee
smoke a cigarette, if you like
use JS and traverse the XML tree
Here You GO!
With these steps you can do it.
Step 1 : Convert your XML to JSON using any one of the libraries (like jquery XML2JSON)
Step 2 : Select your "DIV" with id with jquery($("#yourid")) and modify the visibility according to the value of the visibility property in your json
(e.g)
if(json[feature].visibility=="hidden")
{
$("#yourid").hide();
}

Multipage pdf - display specific page in html or js

I've seen there are few options to display a pdf file within an HTML page
cf.(among others) Recommended way to embed PDF in HTML?
Ok, what about if my pdf is multipage and I want to display a specific page ?
And only a specific page as if it was an image, meaning that the user can't scroll within the pdf.
Q) can I, and how to display a given page of a given pdf ?
imagine a kind of slide-show system, the aim would be to display within a <div> a given page of a given pdf according to the user's demand.
EDIT
ok I've been re-thinking this and actually my question should have been
How can I do exactly like in the previous/next exemple (http://mozilla.github.io/pdf.js/examples/learning/prevnext.html) if my project is hosted on a shared server on which I can't have an ssh access, install any packages or add librarie etc.
many thank's
This is entirely my personal opinion and it's your choice whether to use this way or not, but I would recommend having an iframe with the src set to the required PDF document. Then, add some HTML input buttons with their onclick attribute set to change the source of the iframe to include the parameter for the page number (#page=3). As an example of what I mean, take a look at the code sample below:
<iframe id="example" src="http://www.adobe.com/content/dam/Adobe/en/devnet/acrobat/pdfs/pdf_open_parameters.pdf"></iframe>
<input value="Page 5" type="button" onclick="document.getElementById('example').src='http://www.adobe.com/content/dam/Adobe/en/devnet/acrobat/pdfs/pdf_open_parameters.pdf#page=5';" />
<input value="Page 1" type="button" onclick="document.getElementById('example').src='http://www.adobe.com/content/dam/Adobe/en/devnet/acrobat/pdfs/pdf_open_parameters.pdf';" />
Probably the best approach is to use the PDF.JS library. It's a pure HTML5/JavaScript renderer for PDF documents without any third-party plugins.
Online demo: http://mozilla.github.com/pdf.js/web/viewer.html
GitHub: https://github.com/mozilla/pdf.js
This is probably the best way to do it with JavaScript/HTML5
(Access specific page)
http://mozilla.github.io/pdf.js/web/viewer.html#page=13
Regarding this example,I think that you should use the "View Source" feature in whichever browser you're using to get the HTML and JS for it, then add a JavaScript timer to trigger the onPrevPage(); and onNextPage(); JS functions.If you need help creating a JS timer using the setInterval function to change the pageNum variable, see the following link:http://www.w3schools.com/js/js_timing.asp

Facebook likes Not Working when javascript add

So i am trying to add a like to my individual posts. So i added this to each of the posts. The posts are generated from database output then assembled with the properly styling in a javascript file.So i added this to the creation mix.
<fb:like href="my_not_so_sweet_website" layout="button_count" show_faces="true" width="200"></fb:like>
Weird part is... None of them show up. THEN i try taking that code that i generated for each post and just copy and paste it to the top of my website, and low and behold A like Button!!!. Any clues? Need more info? Help?
You are using what's called FBML. The like button is rendered on the fly (well, on page load) by a facebook javascript libabry you include on the page- it needs the FBML tags to know what to render.
The problem is that the FB library isn't smart enough to know that you've dynamically added these FBML tags to the DOM.
There is another type of like button that's an iframe, that one should work if you put it in the DOM dynamically. Docs for that are here: http://developers.facebook.com/docs/reference/plugins/like/
-when you enter your info into the widget there will be an option for iframe.
There is also a FBML render function in the FB javascript SDK. Docs are here: http://developers.facebook.com/docs/reference/javascript/fb.xfbml.parse/

Categories