javascript - 使用多个 div 的值 javascript

Question

我在网站上有多个 div！例如

<div id='id_111232'>Some text</div>
<div id='id_111233'>Some text</div>
<div id='id_111234'>Some text</div>
<div id='id_111235'>Some text</div>

我想创建一个像这样附加到这个div的javascript

<a href='http://something.com/some/xx'></a>

其中 xx 是上述 div 的值，所以我的意思是：id_ value 我该怎么做？

Answer 1

试试这个 - http://jsfiddle.net/9DAd7/2

var divs = document.getElementsByTagName("div");
var size = divs.length;

for ( var i = 0; i < size; i++ ) {
    var link = document.createElement("a");
    var id = divs[i].getAttribute("id").replace("id_", "");

    link.innerHTML = id;
    link.href      = "http://www.example.com/" + id;

    divs[i].appendChild(link);
}

或者更容易使用 jQuery - http://jsfiddle.net/9DAd7/3/

$("div").each(function() {
    var id = $(this).attr("id").replace("id_", "");
    $(this).append( '<a href="http://www.example.com/' + id + '">' + id + '</a>' );
});

Answer 2

不确定我是否清楚地理解您要完成的工作，但如果您想将上述 div 中的每个文本附加到 href 的末尾，您可以执行如下的 JQuery 操作。

<a id="myLink" href='http://something.com/some'></a>

<div id='appendedDivs'>
<div id='id_111232'>Some text</div>
<div id='id_111233'>Some text</div>
<div id='id_111234'>Some text</div>
<div id='id_111235'>Some text</div>
</div>

<script type="text/javascript">
    var appendedLink=$("myLink").attr("href")+'/';
        $('appendedDivs').childen().each( function() {
        appendedLink = appendedLink + this.text();
    });

    $("myLink").attr("href")=appendedLink;

</script>

这将通过并将 appendedDivs 中的所有 div 文本附加到您的 url。

祝你好运！

Answer 3

使用 jQuery，您可以通过有意义的选择器遍历 div，解析 id 属性并创建如下链接：

HTML：

<div class="link" id='id_111232'>Some text</div>
<div class="link" id='id_111233'>Some text</div>
<div class="link" id='id_111234'>Some text</div>
<div class="link" id='id_111235'>Some text</div>

Javascript：

$('div.link').each(function() {
    var id = $(this).attr('id').split('_')[1];
    $(this).html('<a href="http://something.com/some/' + id + '">' + $(this).text() + '</a>');
});​

这是工作小提琴：http: //jsfiddle.net/archatas/uPR62/