Question

以下代码可以正常使用：

function createElement(element) {
  var id = $(element).attr('id');//and do your stuff with the id
}
createElement('<div id="abc">Some content</div>');

但我想用这样的纯JavaScript：

function createElement(element) {
  var id = this.id;//returns undefined
  console.log(id);
}
createElement('<div id="abc">Some content</div>');

我也试过了element.id但仍导致未定义。那么如何用纯javascript获取id abc？

我也尝试过这样：

function createElement(element) {
  var htmlObject = document.createElement('div');
    htmlObject.innerHTML = element;
    var id = htmlObject.id;//and do your stuff with the id
    console.log(id);
}
createElement('<div id="abc">Some content</div>');

但是返回（空字符串）

Answer 1

对于较新的浏览器，jQuery将在内部使用DOMParser，并执行类似这样的操作

function createElement(element) {
    var doc  = new DOMParser().parseFromString(element, "text/html");
    var elem = doc.body.firstChild;
    console.log(elem.id)
}

FIDDLE

这是使用内置解析器执行此操作的首选方法，但在IE8及更低版本中不支持，您可能必须使用innerHTML等，因此您必须为DOMParser添加后备，如果旧的浏览器是一个问题。

Answer 2

你快到了那里：

function createElement(element) 
{
    var div = document.createElement('div');
    div.innerHTML = element;

    var id = div.firstChild.id; // use firstChild
    console.log(id);
}
createElement('<div id="abc">Some content</div>');

Demo

如何在函数中获取id？

2 个答案: