当前位置：文江博客话题详情

使用 Jquery.attr() 获取 DIV ID

发布于 2024-12-10 12:12:56 字数 394 浏览 0 评论 0 原文

我想使用 .each 和 .attr 函数来获取 div id。我知道该怎么做，但我想要做的是从 DOM 中获取具有特定类（假设为“编辑”类）的每个 div ID，然后将一些数据附加到该 div 中。

这就是我遇到的问题：我想将该特定 DIV 的 ID 放入 .append 内的 .each 循环中。例如：如果我想在 .append 中放置一个链接，我希望该链接为 http://www.website.com/index.php?id=1&div=DIV-ID

任何想法，我是个新手，所以你能提供代码吗例子。我在一定程度上理解 attr 和 .each 。

原文

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

勿忘心安 2024-12-17 12:12:56

http://jsfiddle.net/WrGLC/1/

为了将其保留在此页面上：

HTML：

<div id="1" class="edit">A</div>
<div id="2" class="edit">B</div>
<div id="3">C</div>

JS：

// Anonymous loop, in case you copy and paste this script, the vars won't get confused
(function() {

    // Loop for each .edit
    $('.edit').each(function() {

        // Update the text inside
        $(this).html('http://www.website.com/id='+$(this).attr('id'));

    });

})();

http://jsfiddle.net/WrGLC/1/

For the sake of keeping it on this page:

HTML:

<div id="1" class="edit">A</div>
<div id="2" class="edit">B</div>
<div id="3">C</div>

JS:

// Anonymous loop, in case you copy and paste this script, the vars won't get confused
(function() {

    // Loop for each .edit
    $('.edit').each(function() {

        // Update the text inside
        $(this).html('http://www.website.com/id='+$(this).attr('id'));

    });

})();

回复收藏 0 原文

初与友歌 2024-12-17 12:12:56

这是一个未经测试的解决方案，看起来应该可行。如果有多个类分配给 div 元素，它可能不起作用。

$(function() {
    $('div').each(function() {
        var _t = $(this);
        var id = _t.attr("id");
        if(_t.attr("class") == "someClass") {
            _t.append("<a href = 'http://www.website.com/index.php?id=1&div="+id+"'>Hello World!</a>");

        }
    });
});

Here's an untested solution that looks like it should work. It may not work if there are multiple classes assigned to the div elements.

$(function() {
    $('div').each(function() {
        var _t = $(this);
        var id = _t.attr("id");
        if(_t.attr("class") == "someClass") {
            _t.append("<a href = 'http://www.website.com/index.php?id=1&div="+id+"'>Hello World!</a>");

        }
    });
});

回复收藏 0 原文

后知后觉 2024-12-17 12:12:56

我猜一下。你想要这个吗？

$( '.edit' ).append( function () {
    return '<a href="http://www.website.com/index.php?id=1&div=' + 
        this.id + '">link</a>';
});

I'll guess. You want this?

$( '.edit' ).append( function () {
    return '<a href="http://www.website.com/index.php?id=1&div=' + 
        this.id + '">link</a>';
});

回复收藏 0 原文

江城子 2024-12-17 12:12:56

我认为我正确地解释了您的条件：

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8"/>
    </head>
    <body>
        <div id="a" class="edit">A</div>
        <div id="b" class="edit">B</div>
        <div id="c">C</div>
        <div id="d" class="save">D</div>
        <div id="e" class="edit">E</div>
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
        <script type="text/javascript">
            (function ($) {
                $("div.edit").each(function (i) {
                    var $div = $(this);
                    $div.append('<a href="http://www.website.com/index.php?id=1&div=' + $div.attr("id") + '">Link</a>');
                });
            })(jQuery);
        </script>
    </body>
</html>

更新：@JohnHartsock 是正确的。这里不需要每种方法。我将调整我的代码如下：

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8"/>
    </head>
    <body>
        <div id="a" class="edit">A</div>
        <div id="b" class="edit">B</div>
        <div id="c">C</div>
        <div id="d" class="save">D</div>
        <div id="e" class="edit">E</div>
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
        <script type="text/javascript">
            (function ($) {
                $("div.edit").append(function () {
                    var $div = $(this);
                    $div.append('<a href="http://www.website.com/index.php?id=1&div=' + $div.attr("id") + '">Link</a>');
                });
            })(jQuery);
        </script>
    </body>
</html>

I think I'm correctly interpreting your conditions:

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8"/>
    </head>
    <body>
        <div id="a" class="edit">A</div>
        <div id="b" class="edit">B</div>
        <div id="c">C</div>
        <div id="d" class="save">D</div>
        <div id="e" class="edit">E</div>
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
        <script type="text/javascript">
            (function ($) {
                $("div.edit").each(function (i) {
                    var $div = $(this);
                    $div.append('<a href="http://www.website.com/index.php?id=1&div=' + $div.attr("id") + '">Link</a>');
                });
            })(jQuery);
        </script>
    </body>
</html>

UPDATE: @JohnHartsock is correct. No each method is needed here. I'd adjust my code as follows:

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8"/>
    </head>
    <body>
        <div id="a" class="edit">A</div>
        <div id="b" class="edit">B</div>
        <div id="c">C</div>
        <div id="d" class="save">D</div>
        <div id="e" class="edit">E</div>
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
        <script type="text/javascript">
            (function ($) {
                $("div.edit").append(function () {
                    var $div = $(this);
                    $div.append('<a href="http://www.website.com/index.php?id=1&div=' + $div.attr("id") + '">Link</a>');
                });
            })(jQuery);
        </script>
    </body>
</html>

回复收藏 0 原文

╰つ倒转 2024-12-17 12:12:56

我认为没有必要对each() 进行jQuery 调用。使用 append() 您可以传递一个函数，该函数将代表选择器的当前迭代。

$('div.mydivclass').append(function () {
  return '<a href="http://www.website.com/index.php?id=1&div='+ this.id + '">My Div link</a>';
});

这是一个小提琴http://jsfiddle.net/WFd7k/

I don't believe an jQuery call to each() would be necessary. With append() you can pass a function where this will represent the current iteration of your selector.

$('div.mydivclass').append(function () {
  return '<a href="http://www.website.com/index.php?id=1&div='+ this.id + '">My Div link</a>';
});

Here is a fiddle http://jsfiddle.net/WFd7k/

回复收藏 0 原文

~没有更多了~

关于作者

一场春暖

暂无简介

0 文章

0 评论

23 人气

关注发私信

友情链接

文江博客

使用 Jquery.attr() 获取 DIV ID

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

评论（5）

关于作者

相关话题

热门标签

推荐作者

醉城メ夜风

远昼

平生欢

微凉

Honwey

qq_ikhFfg

友情链接

使用 Jquery.attr() 获取 DIV ID

如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

评论（5）

关于作者

相关话题

热门标签

推荐作者

醉城メ夜风

远昼

平生欢

微凉

Honwey

qq_ikhFfg

友情链接

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。