Skip to content
This repository
Browse code

add Element.appendHTML documentation

add keeto's Element.appendHTML documentation
  • Loading branch information...
commit 6f52e2c0592c32ae9db021490ef7b33876eb3727 1 parent 49522ec
Cristian Carlesso authored arian committed

Showing 1 changed file with 47 additions and 0 deletions. Show diff stats Hide diff stats

  1. +47 0 Docs/Element/Element.md
47 Docs/Element/Element.md
Source Rendered
@@ -728,6 +728,52 @@ Works like [Element:grab](#Element:grab), but replaces the element in its place,
728 728 <div id="child"></div>
729 729 </div>
730 730
  731 +Element Method: appendHTML {#Element:appendHTML}
  732 +------------------------------------------------
  733 +
  734 +Works like [Element:grab](#Element:grab), but instead of accepting an id or an element, it only accepts an HTML string.
  735 +The HTML string will be parsed to create new DOM elements, and then injected relative to the element from where the method
  736 +was called.
  737 +
  738 +### Syntax:
  739 +
  740 + myElement.appendHTML(html[, where]);
  741 +
  742 +### Arguments:
  743 +
  744 +1. html - (*string*) The HTML string to append.
  745 +1. where - (*string*, optional: default 'bottom') The position to inject the text to. Values accepted are 'top', 'bottom', 'before' and 'after'.
  746 +
  747 +### Returns:
  748 +
  749 +* (*element*) The current Element instance.
  750 +
  751 +### Examples:
  752 +
  753 +##### HTML
  754 +
  755 + <div id="myElement">Hey.</div>
  756 +
  757 +##### JavaScript
  758 +
  759 + $('myElement').appendHTML(' <strong>Howdy.</strong>');
  760 +
  761 +##### Resulting HTML
  762 +
  763 + <div id="myElement">Hey. <strong>Howdy.</strong></div>
  764 +
  765 +### Notes:
  766 +
  767 +- This method does *not* use the `innerHTML` property of an element but instead creates elements
  768 +directly before injecting them. Thus, it is safe to use in cases where you don't want to destroy
  769 +any descendant elements already present in the parent.
  770 +- This method uses `insertAdjacentHTML` when available.
  771 +
  772 +### See Also:
  773 +
  774 +- [MDC Element:insertAdjacentHTML][].
  775 +
  776 +
731 777 Element Method: appendText {#Element:appendText}
732 778 ------------------------------------------------
733 779
@@ -2090,3 +2136,4 @@ This method has been deprecated. Use [Elements:append][] instead.
2090 2136
2091 2137 [MDC Element:removeChild]: https://developer.mozilla.org/En/DOM/Node.removeChild
2092 2138 [MDC Element:replaceChild]: https://developer.mozilla.org/En/DOM/Node.replaceChild
  2139 +[MDC Element:insertAdjacentHTML]: https://developer.mozilla.org/en/DOM/Element.insertAdjacentHTML

0 comments on commit 6f52e2c

Please sign in to comment.
Something went wrong with that request. Please try again.