This question already has answers here:
How to get the HTML for a DOM element in javascript
(10 answers)
Closed 9 years ago.
it is impossible to get a string of createElement that you would assign to a variable
var h1 = document.createElement("h1")
h1.innerHTML = "hello world"
alert(h1)
return "[object HTMLHeadingElement]"
when i use appendChild is work but i must use alert or other method
use outerHTML
var h1 = document.createElement("h1")
h1.innerHTML = "hello world"
alert(h1.outerHTML)
Demo: Fiddle
It seems like you want to convert a DOM element to its HTML representation. Put it in a temporary container and access its .innerHTML property:
var div = document.createElement('div');
div.appendChild(h1);
var html = div.innerHTML;
Related
This question already has answers here:
How do I clear the content of a div using JavaScript? [closed]
(2 answers)
Closed 2 years ago.
document.getElementById('test').innerHTML = '<h1>Hello World</h1>';
Is there anyway that I can remove everything the code above put between two HTML tags?
I gather you want to remove the text between the <h1> and the </h1>. Simple:
const test = document.getElementById('test');
const child = test.firstChild;
child.innerHTML = "";
This question already has answers here:
How to compare an html entity with jQuery
(5 answers)
Closed 5 years ago.
I have a span tag as follows:
<span>×</span>
In JavaScript, if I check
$("span").html()
Response is: "-"
Is there any way I can compare
$("span").html() == "×"
instead of $("span").html() == "-"?
You can create an in-memory element and compare it with span
var span = document.querySelector('span');
var dummy = document.createElement('span');
dummy.innerHTML = '×'
console.log(span.innerHTML === dummy.innerHTML)
<span>×</span>
You could decode your html Code Back to normal String.
var decoded = $('<div>').html('×').text();
This value should be comparable.
To treat HTML entities as a string you have to use text() instead of html() method
$("span").text() == "×"
This question already has answers here:
Get specific content off responseText
(3 answers)
Closed 6 years ago.
I am using AJAX to get the HTML DOM of another page and then storing it within a variable like this
var doc=xhr.responseText;
list=doc.getElementsByClassName("Cname");
Since the HTML is stored within the doc variable, I am using it to search for the class ,but it is throwing an error :
Uncaught TypeError: doc.getElementsByClassName is not a function
How to fix this,that is how can I use that variable to search for the class stored in it?
You are applying getElementsByClassName on a string (xhr.responseText is a string) it will only work with dom object not with string.
So instead what you can do is, create a temporary dom element object using document.createElement with the HTML content and get element inside.
var temp = document.createElement('div');
temp.innerHTML = xhr.responseText;
var list = temp.getElementsByClassName("Cname");
var temp = document.createElement('div');
temp.innerHTML = '<div class="Cname">a</div><div class="Cname1">a</div><div class="Cname">a</div>';
var list = temp.getElementsByClassName("Cname");
console.log(list);
This question already has answers here:
Replace method doesn't work
(4 answers)
Closed 7 years ago.
My app read DOM object's attribute value. I want this value to be swapped with some new texts and put back to attribute. The original value is:
"position: absolute; background-image: url(\"http://dealer.raymarine.com/Views/Public/ShowImage.ashx?partno=M81203&view=thumb\")";
but when it should be updated with JS replace method, but nothing is changed, why?
Updating JS code:
var styleValue = ui.helper[0].getAttribute("style");
styleValue.replace("raymarine", "XXX");
styleValue.replace("ShowImage", "ShowImageSystemCreator");
styleValue.replace("view=thumb", "view=png");
ui.helper[0].setAttribute("style", styleValue);
console.log("draggable after text swap: " + styleValue);
You're not saving the value anywhere!
styleValue = styleValue.replace("raymarine", "XXX");
styleValue = styleValue.replace("ShowImage", "ShowImageSystemCreator");
styleValue = styleValue.replace("view=thumb", "view=png");
Make it a one-liner if you want by stringing replaces:
styleValue = styleValue.replace("raymarine", "XXX").replace("ShowImage", "ShowImageSystemCreator").replace("view=thumb", "view=png");
This question already has answers here:
Closed 10 years ago.
Possible Duplicate:
Why does jQuery .after() not chain the new element?
This reference code:
$("#id").after(string);
Does a pretty good job inserting the element of the string where its need to.
How can I get a reference to newly inserted HTML element (string)?
var string = '<div id="some_HTML"><span>hello kitty</span></div>';
$jq_elem = $(string); //if it's not a jQuery object, make it one
$("#id").after($jq_elem); //insert into DOM
$jq_elem.css('color', 'red'); //still available
FIDDLE
Try using insertAfter:
var $str = $(string).insertAfter('#id');
This will work if string is HTML.