[英]innerHTML from Javascript String
I have a JavaScript string with HTML content inside it. 我有一个包含HTML内容的JavaScript字符串。
eg 例如
var HTMLtext = 'text <div id="test-div-1">this is <b>just</b> a div</div><div id="test-div-2">this is <b>just</b> another div</div> more filler text';
I am looking to get the innerHTML from the first div element within this string. 我希望从此字符串中的第一个div元素获取innerHTML 。 When I try using: 当我尝试使用时:
var testDiv1 = HTMLtext.getElementByID("test-div-1");
I get the error 我得到错误
HTMLtext.getElementByID is not a function at window.onload HTMLtext.getElementByID不是window.onload的函数
Are there any workarounds without putting HTMLtext in a temporary container? 有没有将HTMLtext放在临时容器中的解决方法?
Since you have jQuery in the question tags this is very simple... 由于问题标签中包含jQuery,因此这非常简单...
var testDiv1 = $("<div/>", { html: HTMLtext }).find("#test-div-1").html();
That creates a non-DOM element, sets the html value and then parses and gets the inner html of the div you want. 这将创建一个非DOM元素,设置html值,然后解析并获取所需div的内部html。
Here's an updated version of your jsfiddle... 这是您的jsfiddle的更新版本...
var HTMLtext = 'text <div id="test-div-1">this is <b>just</b> a div</div><div id="test-div-2">this is <b>just</b> another div</div> more filler text';
var tempDom = $('<output>').append($.parseHTML(HTMLtext));
$("#test-div-1",tempDom);
Parse the string to create HTML and create a temporary DOM so that jquery can traverse it. 解析该字符串以创建HTML并创建一个临时DOM,以便jquery可以遍历它。
As was mentioned in the comments, there is no string (prototype) function getElementByID. 如注释中所述,没有字符串(原型)函数getElementByID。 You are likely thinking of document.getElementById() . 您可能正在考虑document.getElementById() 。 To use that, you would have to create an element with document.createElement() , set the innerHTML to the html string, add the element to the DOM (perhaps hidden so it isn't visible) with document.body.appendChild() , then use document.getElementById() (note that the D is lowercase). 要使用,你就必须创建一个元素使用document.createElement() ,的innerHTML设置为HTML字符串的元素添加到DOM(也许隐藏所以它是不可见)与document.body.appendChild() ,然后使用document.getElementById()(请注意,D是小写)。 But that would be creating a temporary container. 但这将创建一个临时容器。
jQuery does simplify this a bit. jQuery确实简化了这一点。 It still requires creating a container but it doesn't have to be appended to the DOM. 它仍然需要创建一个容器,但不必将其附加到DOM。 After creating an element with jQuery() and setting the html with .html() , use jQuery.find() to find the element with the id selector . 使用jQuery()创建元素并使用.html()设置html后,使用jQuery.find()查找具有id选择器的元素。 Then use .html() to get the html contents of the first element found. 然后使用.html()获取找到的第一个元素的html内容。
var HTMLtext = 'text <div id="test-div-1">this is <b>just</b> a div</div><div id="test-div-2">this is <b>just</b> another div</div> more filler text'; var testDiv1 = $('<div>').html(HTMLtext).find('#test-div-1'); console.log(testDiv1.html());
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.