I cannot seem to find a link for a HTML api.
I want to see element.innerHtml, element.OuterHtML. Basically all methods I can invoke in a javascript function to get an elements rendered/not rendered text. Thank you very much
I think you are looking for the DOM API.
You can find it on the w3 site.
The HTML specification is about the structure of the HTML document, not how to access it with innerHTML and other methods.
Try out : https://developer.mozilla.org/en/DOM/element
MDC Doc center is a great reference to use for everything relative to HTML. You can generally find the pages from MDC directly from google. Here I searched "element MDC"
Cheers,
-stan
You want the spec for the Document Object Model.
http://www.w3.org/TR/2000/REC-DOM-Level-2-Core-20001113/core.html
http://www.w3.org/DOM/DOMTR
A cleaner list can be found here:
https://developer.mozilla.org/en/DOM/element
There is the W3C DOM Level 2 HTML specification which documents some of the bindings you may be interested in. (Seven years ago I put this into a more browsable format here: http://objjob.phrogz.net/html/hierarchy)
However, some of the properties you discuss, such as innerHTML are considered "DOM Level 0". They were implemented by browsers before there was a standard.
You might also be interested in the MSDN DHTML reference, which documents properties, methods, and more supported by various versions of IE. While some of them are non-standard, the documentation these days generally indicates which items are standard and which are proprietary extensions.
Finally, there is the Gecko DOM Reference which provides good information from Mozilla.
Related
I've been working on a small project, which changes site content on load.
I used data-*attributes, and after job has been done (script replaces what has to be replaced) they would get removed.
However, I realized my very own attributes worked also. So instead of
data-myAttribute="value"
I could simply used
myAttribute="value"
What is browser support on those attributes?
(My very own attributes worked on Chrome v57)
You can pretty much add any attribute you want to any HTML tag. However, this is not supported by the HTML standard. It does work in pretty much any browser, but it might not be supported in the future. In addition, HTML validators will reject your HTML as invalid if you use non-standard attributes.
The whole reason we have data-* attributes is because those are standardized and are guaranteed to be supported and accepted by validators, and also are guaranteed to not clash with any future attributes that might get added to HTML.
Do not use custom attributes without the data-* prefix, as that might make your HTML break without any warning as the HTML standard evolves.
As for the question itself: As this is non-standard, browser support is not documented.
I have never seen it before until today and it seems to just work without including any .js or framework. is this a standard object in javascript? if so where can I find the documentation for it and other uncommon Objects that are available in javascript
Looks like you need to learn about MDN
https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Global_Objects/JSON/stringify
It's part of the ES5 specification. See http://es5.github.io/ for the whole annotated spec and for this function specifically see http://es5.github.io/#x15.12.3
See also http://caniuse.com/#search=json for a browser support matrix.
Yes it is. It's a standard object, in common use and works in all current browser versions. Documentation here.
The only time you'll have a problem with it is in old IE versions; if you need to support them, you'll need to use a polyfill library like this one.
I have been using a DOMParser object to parse a text string to an XML tree. However it is not available in the context of a Web Worker (and neither is, of course, document.ELEMENT_NODE or the various other constants that would be needed). Is there any other way to do that?
Please note that I do not want to manipulate the DOM of the current page. The XML file won't contain HTML elements or anything of the sort. In fact, I do not want to touch the document object at all. I simply want to provide a text string like the following:
<car color="blue"><driver/></car>
...and get back a suitable tree structure and a way to traverse it. I also do not care about schema validation or anything fancy. I know about XML for <SCRIPT>, which many may find useful (hence I'm linking to it here), however its licensing is not really suitable for me. I'm not sure if jQuery includes an XML parser (I'm fairly new to this stuff), but even if it does (and it is usable inside a Worker), I would not include an extra ~50K lines of code just for this function.
I suppose I could write a simple XML parser in JavaScript, I'm just wondering if I'm missing a quicker option.
according to the spec
The DOM APIs (Node objects, Document objects, etc) are not available to workers in this version of this specification.
I guess thats why DOMParser is not availlable, but I don't really understand why that decision was made. (fetching and processing an XML document in a WebWorker does not seems unreasonnable)
but you can import other tools available: a "Cross Platform XML Parsing in JavaScript"
At this point I like to share my parser: https://github.com/tobiasnickel/tXml
with its tXml() method you can parse a string into an object and it takes only 0.5kb minified + gzipped
As the title.
And is there a picture which introduces HTML DOM's construct?
The DOM (Document Object Model) begins at the document node. It is referred to as the "root node".
Observe the following tree (corresponding nodeTypes in parentheses):
[HTMLDocument](9)
[DocumentType](10)
[HTMLHTMLElement](1)
[HTMLHeadElement](1)
[HTMLTitleElement](1)
[Text]Title(3)
[HTMLBodyElement](1)
The tree¹ would be formed from the following markup:
<!DOCTYPE HTML><html><head><title>Title</title></head></body></html>
Note the distinct lack of whitespace. Adding whitespace would add text nodes to the document tree and clearly make it more difficult to simulate.
The window object is not part of the DOM. It is a host object implemented as the "global object" to complete an ECMAScript implementation. It has its own standard which is available from the W3C. Whereas the global object is required to complete an ECMAScript implementation, the DOM is not. This is exemplified in the node.js environment.
¹ Certain environments ignore the doctype node. I've observed Opera 5-9 and Safari 3.1 as environments that exhibit this behaviour.
There is no public standard for window, but most browsers support it with Window at the root.
I've found a lot of good stuff at: http://www.w3schools.com (I have no connection with the site).
A simple google search for "dom html" images will get you images. Then...
When all else fails - go to the source: http://www.w3.org/TR/DOM-Level-2-HTML/html.html
As far as I can tell, the template feature in XUL doesn't allow you to load JSON data into your listbox/tree/etc. element. -- it only supports XML and RDF. The closest thing I found to an indication that it might someday support JSON, is the comments on this blog post from 2007, saying that there was a bug filed. But the bug in question is marked RESOLVED FIXED and JSON is still not supported. So I guess my options are:
Get the data I need in XML, and display it using templates.
Get the data in JSON, and display it by direct DOM manipulation.
Use one of these third-party templating solutions.
So my question is, am I correct that templates don't support JSON? If not, where is that feature documented? If I am correct, what should I consider when choosing among the above three options?
It turns out that writing your own custom object that implements nsITreeView is a lot simpler than I expected, and makes everything seem nice and fast.
I'm not sure about JSON in XUL templates, however I'd suggest option 2, given the ease with which JSON is used within the browser.
From Firefox 3.5, you can just do
var obj = JSON.parse(xhr.responseText);