0

我有一些显示一些内容的类名 fawas。实际上我必须在 java script 中的 Div 下面添加一些内容。请帮助我。

<div class="fawas">
    this is my name fawas khan.
</div>

我的 JavaScript 代码是

var dynamic = "这是我的联系电话。"; var _body = document.getElementsByTagName('body') [0].innerHTML =dynamic;

我得到的只是一个附加的div。

4

4 回答 4

2

在纯 javaScript 中，通过 className 获取元素是丑陋的。请参阅如何在 JavaScript 中按类获取元素？了解更多信息。

基本上，你会想要这个功能：

function getElementsByClass(tagType, className) {
    var elems = document.getElementsByTagName(tagType);
    var returns = [];
    for (var i in elems) {
        if ((' ' + elems[i].className + ' ').indexOf(' ' + className + ' ') > -1) {
            returns.push(elems[i]);
        }
    }
    return returns;
}

一旦你有了它，剩下的就不是太糟糕了：

var dynamic = document.createElement("div");
dynamic.innerHTML = "this is my contact number.";

var elements = getElementsByClass("div", "fawas");
if (elements.length > 0) {
    // just change the first, as you did in your post
    elements[0].parentNode.insertBefore(dynamic, elements[0].nextSibling);
}

我动态创建您的新 div，而不仅仅是一个文本字符串。

然后，我得到你想要插入的元素的父元素insertBefore，在你选择的元素之后使用这个函数。

这是一个工作小提琴。

正如其他人向您展示的那样，使用 jQuery 可以更简洁。不知道node.js有没有功能会更方便，所以给出了纯JS的方案。

于 2013-09-18T17:25:04.163 回答
1

如果您对 jQuery 解决方案感兴趣，这里有一个Fiddle

<div class="fawas">
  this is my name fawas khan.
</div>


$(function(){
  var dynamic = ('this is my contact number.');
  $('.fawas').after('<div class="fawas2">'+dynamic+'</div>');
});
于 2013-09-18T17:22:48.643 回答
0

你的 html 应该是，

<div class="fawas">
    this is my name fawas khan.
</div>
<div id="fawas-2">
</div>

你的脚本应该是，

<script type="text/javascript">
var dynamic = "this is my contact number."; 
document.getElementById('fawas-2').innerHTML =dynamic;
</script>
于 2013-09-18T17:17:24.730 回答
0

你可以这样做

var oldcontent = document.getElementsByTagName('body') [0].innerHTML;

document.getElementsByTagName('body') [0].innerHTML = oldcontent + dynamic

您要添加的内容在哪里动态

于 2013-09-18T17:17:59.340 回答