我想替换html元素中的内容，所以我使用以下函数:
function ReplaceContentInContainer(id,content) {
var container = document.getElementById(id);
container.innerHTML = content;
}
ReplaceContentInContainer('box','This is the replacement text');
<div id='box'></div>
上面的工作很好，但问题是我有一个页面上的html元素，我想替换的内容。所以我不能用id，只能用类。有人告诉我，javascript不支持任何类型的内置get元素的类函数。那么，如何修改上面的代码以使其使用类而不是id呢?
附注:我不想使用jQuery。
当前回答
这段代码应该可以在所有浏览器中运行。
function replaceContentInContainer(matchClass, content) {
var elems = document.getElementsByTagName('*'), i;
for (i in elems) {
if((' ' + elems[i].className + ' ').indexOf(' ' + matchClass + ' ')
> -1) {
elems[i].innerHTML = content;
}
}
}
它的工作方式是遍历文档中的所有元素，并在它们的类列表中搜索matchClass。如果找到匹配项，则替换内容。
示例，使用Vanilla JS(即没有框架)
其他回答
这应该工作在几乎任何浏览器…
function getByClass (className, parent) {
parent || (parent=document);
var descendants=parent.getElementsByTagName('*'), i=-1, e, result=[];
while (e=descendants[++i]) {
((' '+(e['class']||e.className)+' ').indexOf(' '+className+' ') > -1) && result.push(e);
}
return result;
}
你应该可以这样使用它:
function replaceInClass (className, content) {
var nodes = getByClass(className), i=-1, node;
while (node=nodes[++i]) node.innerHTML = content;
}
这段代码应该可以在所有浏览器中运行。
function replaceContentInContainer(matchClass, content) {
var elems = document.getElementsByTagName('*'), i;
for (i in elems) {
if((' ' + elems[i].className + ' ').indexOf(' ' + matchClass + ' ')
> -1) {
elems[i].innerHTML = content;
}
}
}
它的工作方式是遍历文档中的所有元素，并在它们的类列表中搜索matchClass。如果找到匹配项，则替换内容。
示例，使用Vanilla JS(即没有框架)
我认为是这样的:
function ReplaceContentInContainer(klass,content) {
var elems = document.getElementsByTagName('*');
for (i in elems){
if(elems[i].getAttribute('class') == klass || elems[i].getAttribute('className') == klass){
elems[i].innerHTML = content;
}
}
}
会工作
var elems = document.querySelectorAll（'.one'）; for （var i = 0; i < elems.length; i++） { elems[i].innerHTML = 'content'; };
简单易行的方法
var cusid_ele = document.getElementsByClassName('custid');
for (var i = 0; i < cusid_ele.length; ++i) {
var item = cusid_ele[i];
item.innerHTML = 'this is value';
}
