I'm trying to create a Firefox extension using the same html files I used to chrome extension.
With some Google search, I found a way to use
xmlns:xul="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
xmlns="http://www.w3.org/1999/xhtml"
As namespace and to use the html file which I used in chrome as it is and its working fine. Now, I want to add elements dynamically into that html file using JavaScript. For example
var testdiv=document.getElementById('test');
var a = document.createElement('a');
a.setAttribute("innerText", "test");
testdiv.appendChild(a);
But this is not giving the expected out put. Any suggestions on this or any other way to do this??
If you want to create elements in a namespace, you have to use document.createElementNS method. So in your case, creating the A element would look like this:
var a = document.createElementNS('http://www.w3.org/1999/xhtml', 'a');
Related
I want to automatically load up adverts inside the body of my blog website
For Example:
<div class="dynamic-ads-div"></div>
After loading up ckeditor 5, i want to replace the above element with an advert code from platforms like ezoic, google, etc. I have tried to put the code directly in the blog post body, but ckeditor keeps filtering, after rigorous research, i could only preserve the custom html elements like <ins>, but any form of script tags are filtered out, i want to use the approach of loading up ckeditor before adding the advert code dynamically, I tried editor:
document.querySelectorAll(".dynamic-ads-div").forEach(ads => { ads.innerHTML = '<script src="LINK_TO_ADS_PLATFORM"></script><custom-element></custom-element><script>INIT_ADS_CODE</script>' }).
Ckeditor completely ignores the above code.
Any form of help will be greatly appreciated; If you can help me preserve the script tags, or help me insert content dynamically after loading up ckeditor.
Thanks
I'm not sure if it's possible or not but can you run a script in Quickbase? Such as in a formula field? If so, could someone show me a very simple example? I've figured out how to create custom Dashboards using jQuery so I assume we could do something similar on form/table.
There are two ways you could try to accomplish this. You can use Javascript in URL and Formula URL fields. This will make the link button pop up a window that says "Hello World".
"javascript:alert(\"Hello World\");void(0);"
You can also load a page that you've created using Dan Diebolt's image onload technique. I can't find his original post, but you use the onload event of an image tag to load a .js file. In this example it's a page in the same application named module.js that is being loaded using a Formula Text field with HTML enabled.
"<img qbu=\"module\" src=\"/i/clear2x2.gif\" onload=\"javascript:if(typeof QBU=='undefined'){QBU={};$.getScript('" & URLRoot() & "db/" & Dbid() & ?a=dbpage&pagename=module.js&rand='+Math.random())}\">"
The corresponding module.js file might look something like this:
(function(){
alert("Hello World");
})();
You can take this as far as you'd like from writing functions in module.js that you call from Formula URL Fields to injecting your own HTML into the DOM (though Quickbase recommends you do not do that). My favorite trick is to add <span id="somethingUnique"></span> either in the form builder or a text field with HTML enabled and use that to inject my custom buttons or data.
So I followed a tutorial setting up a Markdowndeep editor using MVC and the editor and preview work just fine. The tutorial didn't mention how to render specific text on a page using Markdowndeep though. So I did a few Google searches thinking I'd find an obvious answer but to my surprise I didn't.
Can someone show me an example on how to render a portion of text using Razor?
I figured out the syntax. It was #Html.Markdown(Model.Body)
You must have Markdown Helper installed though.
Another option is to force Razor to return the RAW Html.
If we extend the MarkDownDeep Example, we get the following:
// Instantiate
var md=new MarkdownDeep.Markdown();
// Set options
md.ExtraMode=true;
// Translate
var html=md.Transform(plaintext);
<div>#Html.Raw(html)</div>
and your markdown as HTML should be in the div!
I want to get the data for a form so i wrote the below. It didnt work
doc.DocumentNode.SelectNodes("//form[#name='F1']//input[#name]");
Breaking it up into two steps did
var node = doc.DocumentNode.SelectSingleNode("//form[#name='F1']");
var nodes = node.SelectNodes("//input[#name]");
However i get the data from the entire html file rather then the node/form which is unexpected. How do i get the results from that form only? I tried /input[#name] and .//input[#name] which gave me null
It seems this is default behavior for <form> tag parsing in Html Agility Pack. As they said here:
FORM is treated
like this because many HTML pages used to have overlapping forms, as
this was actually a (powerful) feature of original HTML. Now that XML
and XHTML exist, everybody assumes that overlapping is an error, but
it's not (in HTML 3.2).
You could change it by using:
HtmlNode.ElementsFlags.Remove("form");
and your "//form[#name='F1']//input[#name]" expression should work. Or change the second expression to ".//input[#name]" and it also should work:
var node = doc.DocumentNode.SelectSingleNode("//form[#name='F1']");
var nodes = node.SelectNodes(".//input[#name]");
I have made a firefox extension which loads a web page using xmlhttprequest.
My extension has it's own window opened alongside the main Firefox.
The idea of my extension is to load a webpage in memory, modify it and publish in newly opened tab in firefox.
The webpage has a div with id "Content". And that's the div i want to modify. I have been using XPath alot in greaseMonkey scripts and so i wanted to use it in my extension, however, i have a problem. It seems it doesn't work as i would want. I always get the result of 0.
var pageContents = result.responseText; //webpage which was loaded via xmlhttprequest
var localDiv = document.createElement("div"); //div to keep webpage data
localDiv.innerHTML = pageContents;
// trying to evaluate and get the div i need
var rList = document.evaluate('//div[#id="content"]', localDiv, null XPathResult.ORDERED_NODE_SNAPSHOT_TYPE, null);
The result is always 0 as i said. Now i have created the local div to store website data because i cannot parse the text using XPath. And document in this case is my extensions XUL document/window.
I did expect it to work, but i was wrong.
I know how to extract the div using string.indexOf(str) and then slice(..). However, thats very slow and is not handy, because i need to modify the contents. Change the background, borders of the many forms inside this div. And for this job, i have not seen a better method than evaluating XPath to get all the nodes i need.
So main question is, how to use XPath to parse loaded web page in firefox extension?
Thank you
Why not load the page in a tab, then modify it in place, like Greasemonkey does?
As for your code, you don't say where it executes (i.e. what is document.location?), but assuming it runs in a XUL window, it makes no sense -- document.createElement will not create an HTML element (but a XUL div element, which has no special meaning), innerHTML shouldn't work for such element, etc.