Stack Overflow
Stack Overflow

Questions tagged [innerhtml]

innerHTML is a DOM node's property that gets or sets the inner HTML code of an HTML element. It is commonly used in Javascript to dynamically change or read from a page.

innerHTML is a DOM node's property that gets or sets the inner HTML code of an HTML element. It is commonly used in JavaScript to dynamically change or read from a page.

Syntax to get innerHTML

var content = element.innerHTML; /* To get the inner HTML of an element */

where,

content contains the serialized HTML code describing all of the element's descendants.

Syntax to set innerHTML

element.innerHTML = content; /* To set the inner HTML of an element */

Removes all of element's children, parses the content string and assigns the resulting nodes as children of the element.

2983 questions
21
votes
6 answers

jQuery html() in Firefox (uses .innerHTML) ignores DOM changes

I'm really suprised I haven't run into this problem before, but it seems that calling jQueries .html() function on an element ignores changes in the DOM, i.e it returns the HTML in the original source. IE doesn't do this. jQueries .html() just uses…
JonoW
  • 14,029
  • 3
  • 33
  • 31
20
votes
4 answers

why if (element.innerHTML == "") is not working in firefox

why is if (element.innerHTML == "") not working in firefox but works fine in IE , any ideas please ?
Mahmoud Farahat
  • 5,364
  • 4
  • 43
  • 59
20
votes
6 answers

Angular 2 equivalent of ng-bind-html, $sce.trustAsHTML(), and $compile?

In Angular 1.x, we could insert HTML in real-time by using the HTML tag ng-bind-html, combined with the JavaScript call $sce.trustAsHTML(). This got us 80% of th way there, but wouldn't work when Angular tags were used, such as if you inserted HTML…
Vern Jensen
  • 3,449
  • 6
  • 42
  • 59
20
votes
3 answers

XSS prevention and .innerHTML

When I allow users to insert data as an argument to the JS innerHTML function like this: element.innerHTML = “User provided variable”; I understood that in order to prevent XSS, I have to HTML encode, and then JS encode the user input because the…
pineappleman
  • 849
  • 4
  • 8
  • 20
20
votes
2 answers

innerHtml prepend text instead of appending

I have a function that emulates typing with few lines of basic JavaScript code, however it appends text, but I want to prepend text to the element before any other already existing text/elements without changing html structure. How this can be…
vlad
  • 1,511
  • 5
  • 17
  • 26
19
votes
4 answers

Angular 2 : Stop propagation of parent element's event , when clicking on link

I have a case of event bubbling. Example : // content of innerHtml is : The tag is rendered from another component through…
misha
  • 231
  • 1
  • 2
  • 5
18
votes
9 answers

get opening tag including attributes - outerHTML without innerHTML

I would like to retrieve a certain tag element with its attributes from the DOM. For example, from link text I want to get , optionally with a closing , either as a string or some…
Richard Kiefer
  • 1,814
  • 2
  • 23
  • 42
18
votes
2 answers

Javascript - Replace html using innerHTML

I'm trying to replace html using innerHTML javascript. From: aaaaaa/cat/bbbbbb To: Helloworld This's my code

aaaaaa/cat/bbbbbb

Dexter
  • 183
  • 1
  • 1
  • 4
17
votes
10 answers

Debugging IE8 Javascript Replace innerHTML Runtime Error

function DeleteData(ID) { var ctrlId=ID.id; var divcontents=document.getElementById(ctrlId).innerHTML; var tabid=ctrlId.replace(/div/,'tab'); var tabcontents=document.getElementById(tabid).innerHTML; …
SandHurst
17
votes
4 answers

Why innerHtml doesn't work

Why doesn't innerHtml work?
user1640342
15
votes
2 answers

Should I use [innerHTML] or the usual way (Angular 2)

I have my example: string; in my component.ts file. I can output this variable in two ways (at least that I know of): I can do:

{{ example }}

and I can do:

Well, when I use the first way, my IDE (phpStorm)…
Eliya Cohen
  • 10,716
  • 13
  • 59
  • 116
15
votes
1 answer

AngularJS element.innerHTML is undefined from within directive

Let's say I have: directives.directive('foo', function () { return { restrict:'A', scope: true, link:function (scope, element, attr) { console.log('innerHTML is ' + element.innerHTML); …
Robert Christian
  • 18,218
  • 20
  • 74
  • 89
14
votes
2 answers

Modifying the innerHTML of a