Getting literal markup of XML elements - javascript

In an HTML document have an XML structure from an AJAX request. I would like to display it using custom syntax highlighting. For this I need the markup of the XML tags as they appear in the loaded file, i.e. retaining unnecessary spaces etc. The data is clearly stored in the structure, as seen in each element's parent's innerHTML property. But how can I elegantly retrieve it from a given XML element node? I could use something like Elt.outerHTML.split(Elt.innerHTML), but that is clumsy and not totally conforming to the standard.
Is there a better way to do this? Until now I have been using my own very crude XML parser, but I want to get away from that.

Consider using the XMLSpectrum syntax highlighting tool from Qutoric (Phil Fearon - #pgfearo). We used it to good effect in the W3C XSLT 3.0 specification.
http://qutoric.com/xmlspectrum/

Related

xml data from API has multiple undefined name spaces - how to use xslt to display it in html?

I am using a REST api to get XML data from a database and am trying to display it in an html format using xslt. Unfortunately the xml data comes back with a few namespaces that are not defined. I can get the style sheet to work just fine on a local copy of the data if I strip the namespaces or define them. Striping the name spaces feels like a hack and no the correct way to do this.
this is essentially an example of the data I get back:
<root>
<entity:Entity ns1:atrib="foo">
<g:Value>foo1</g:value>
<g:Name>fooName</g:Name>
</entity:Entity>
xmlhttprequest methods in JS to get this information and XSLTProcessor to transform it then add it into a . It's not displaying the transformed information and i'm 100% positive it's the namespaces that is causing the issue.
I've googled everything I can think of with no luck. Road blocks like this are almost always due to me missing something fundamental.
XSLT will only operate on XML that is well-formed, and it requires all namespaces to be declared. If you want to process this data you should ideally fix it at source; if you can't do that you need to repair it before processing.
There are some XML parsers that allow you to process non-namespace-aware XML, and you could use such a parser as the basis of your repair tool, but this is such an unusual requirement that I'll have to leave you to research how to do that yourself.

Parsing XML with createContextualFragment doesn't handle self-closing tags?

I have used DOMParser to successfully parse XML in JavaScript and I was trying to use document.createRange().createContextualFragment as the performance seems to be better.
I found that while DOMParser handles self-closing tags fine, when using createContextualFragment they are not handled, causing subsequent elements to be nested underneath them. I created a jsfiddle demonstrating the difference here https://jsfiddle.net/p8mokmsy/.
So my question is, why is createContextualFragment doing this? It seems like the behavior is the same across all browsers so it must be according to the spec?
I'm trying to follow https://www.w3.org/TR/DOM-Parsing/#dfn-concept-parse-fragment but it's a bit over my head. Maybe my string is being detected as an HTML document instead of XML?

Metor: save html as string and later convert it to a DOM node

I would like to save a string like "<div class='some_class'>some content</div>", in a mongo document, and later, when I fetch this content, I want to convert it into a DOM node.
How can I edit the content before adding it to the DOM and convert it to a DOM node using meteor?
As suggested by #blaze-sahlzen you can use Cheerio for the manipulation of the HTML. But after all, it's just a String that you can also modify with the usual methods.
To show the HTML, I suggest you look into {{{triple braces}}} - they can be used to include raw HTML within your page. You should use these cautiously and make sure the HTML content is safe and free from syntax errors. Be very sure to sanitize (escape/clean) the HTML before you store it in mongo!
If it is a whole template that you wanna render, there is an API for it here.

How should I parse XML-like data in JavaScript?

I have data sets similar to this:
<NDL>
<REPLICA 4925770B:0025BA85>
<VIEW OF64623968:A2336DB0-ON49256C46:002ACF42>
<NOTE OFA52D3E8C:0ED3F84A-ON605F586A:5D1C1FAA>
<HINT>CN=YW8LN6/O=TDK-JP</HINT>
<REM>Database 'Shunya Sato', View '受信ボックス', Document '[Requirement management system - Feature #125] (New) Collect example of LN link'</REM>
</NDL>
I need to retrieve the content enclosed by the <HINT> tag, and the pseudo-attributes in the , and tags. Is there some lib that could help me out with this, or is the best way to hope that everything will always be in this order and use split/find/other builtin stuff?
Unfortunately, unless you write a custom parser that can turn what you have into XML, you won't be able to use any traditional XML libraries to read your data. The only reason that people can perform XML queries over HTML is because there are clearly defined ways to convert HTML into a DOM, which can then be converted into XML. The same cannot be said for your data.
While your data may resemble XML, the only thing it has in common is the use of < and > to delimit fields. As such, you are probably just better off using string searching and spliting to get the fields you need.

Parsing HTML using JavaScript

I'm working a page that needs to fetch info from some other pages and then display parts of that information/data on the current page.
I have the HTML source code that I need to parse in a string. I'm looking for a library that can help me do this easily. (I just need to extract specific tags and the text they contain)
The HTML is well formed (All closing/ending tags present).
I've looked at some options but they are all being extremely difficult to work with for various reasons.
I've tried the following solutions:
jkl-parsexml library (The library js file itself throws up HTTPError 101)
jQuery.parseXML Utility (Didn't find much documentation/many examples to figure out what to do)
XPATH (The Execute statement is not working but the JS Error Console shows no errors)
And so I'm looking for a more user friendly library or anything(tutorials/books/references/documentation) that can let me use the aforementioned tools better, more easily and efficiently.
An Ideal solution would be something like BeautifulSoup available in Python.
Using jQuery, it would be as simple as $(HTMLstring); to create a jQuery object with the HTML data from the string inside it (this DOM would be disconnected from your document). From there it's very easy to do whatever you want with it--and traversing the loaded data is, of course, a cinch with jQuery.
You can do something like this:
$("string with html here").find("jquery selector")
$("string with html here") this will create a document fragment and put an html into it (basically, it will parse your HTML). And find will search for elements in that document fragment (and only inside it). At the same time it will not put it in page DOM

Categories