jQuery在HTML标记上拆分，即在h2标记的每个实例上拆分？

我正试图找到所有的

标签，将它们拆分，并在它们周围加入

。我离得很近，但被卡住了

<script type="application/javascript">
$(document).ready(function() {


// finds all h2's within wrapper div grabs the text splits at ? and applies a links around each one
var al = $('#wrapper').find('h2').text().split("?").join("?</a><br /> <a  href='#'>");

// Add all the split h2's from the variable above al to a div called .text
$('.text').html('<ul>' + al + '</ul>');


});      
</script>

$（文档）.ready（函数（）{
//查找包装器div中的所有h2获取？处的文本拆分，并在每个拆分周围应用链接
var al=$（“#wrapper”）.find（'h2'）.text（）.split（“？”）.join（“？

好的，现在我可以在

？

处拆分它们，因为每个问题都以

？

结尾，但我的问题是，这遗漏了第一个问题

---

因此，我的解决方案是在

标记处拆分它们。这是可能的，还是我尝试了这么多更好的选择？

如果需要这样做，那么为什么不使用jQuery将

h2

元素替换为

a

锚点，然后再添加

$('h2').after('<br />').replaceWith(function() {
    return $('<a>', {
        href: '#',
        text: $(this).text()
    });
});

此外，

ul

列表中的锚定和

标记无效-为什么不使用

li

列表元素

---

实际上，要完成这里要做的事情，最好的方法是使用服务器端代码为每个锚和

h2

元素生成

#hash

和

id

var ul = $('<ul>');

$('#wrapper h2').each(function(){
    var t = $(this);

    $('<a>', {
        text: t.text(),
        href: '#', 
        click: function(e){
            $('body').animate({scrollTop: t.offset().top}, 'fast');
            e.preventDefault();
        }
    }).wrap('<li>').parent().appendTo(ul);
}).prependTo('.left-col');

---

如果您想要更高级的东西，也可以使用

fadeToggle（）

和

slideToggle（）

函数。

如果需要这样做，那么为什么不使用jQuery将

h2

元素替换为

a

锚定，然后添加

$('h2').after('<br />').replaceWith(function() {
    return $('<a>', {
        href: '#',
        text: $(this).text()
    });
});

此外，

ul

列表中的锚定和

标记无效-为什么不使用

li

列表元素

---

实际上，要完成这里要做的事情，最好的方法是使用服务器端代码为每个锚和

h2

元素生成

#hash

和

id

var ul = $('<ul>');

$('#wrapper h2').each(function(){
    var t = $(this);

    $('<a>', {
        text: t.text(),
        href: '#', 
        click: function(e){
            $('body').animate({scrollTop: t.offset().top}, 'fast');
            e.preventDefault();
        }
    }).wrap('<li>').parent().appendTo(ul);
}).prependTo('.left-col');

---

如果您需要更高级的功能，也可以使用

fadeToggle（）

和

slideToggle（）

函数。

非常感谢。我只是试图理解代码，以便将来可以使用它。我对jquery非常陌生，希望学习；）

这是我正在处理的网页和完整的代码，以便您可以看到结果。您可能会看到更好的方法

$（文档）.ready（函数（）{
var al=$（'.text'）；
$（'h2'）。每个（函数（）{
$('', {
text:$（this）.text（），
href:“#”
}).wrap（“
”）.parent（）.appendTo（al）；
});
$（'.text a'）。单击（函数（e）{
e、 预防默认值（）；
//删除下面添加的h2类跳转
$（'h2'）.removeClass（'jump'）；
//获取此链接中已单击的文本
var alink=$（this.text（）；
//过滤所有h2，并在上面的文本中找到匹配项，然后添加类跳转
$（'h2:contains（“+alink+”））.addClass（“jump”）；
//使用类跳转滚动到h2
$（'html，body'）.animate（{scrollTop:$（'h2.jump”）.offset（）.top}，'fast'）；
返回false；
}); 
});                  

太棒了，非常感谢。我只是想理解代码，以便将来可以使用它。我对jquery非常陌生，希望学习；）

这是我正在处理的网页和完整的代码，以便您可以看到结果。您可能会看到更好的方法

$（文档）.ready（函数（）{
var al=$（'.text'）；
$（'h2'）。每个（函数（）{
$('', {
text:$（this）.text（），
href:“#”
}).wrap（“
”）.parent（）.appendTo（al）；
});
$（'.text a'）。单击（函数（e）{
e、 预防默认值（）；
//删除下面添加的h2类跳转
$（'h2'）.removeClass（'jump'）；
//获取此链接中已单击的文本
var alink=$（this.text（）；
//过滤所有h2，并在上面的文本中找到匹配项，然后添加类跳转
$（'h2:contains（“+alink+”））.addClass（“jump”）；
//使用类跳转滚动到h2
$（'html，body'）.animate（{scrollTop:$（'h2.jump”）.offset（）.top}，'fast'）；
返回false；
}); 
});                  

你应该用新的细节编辑你的问题，而不是回答你自己的问题如果这不是答案，你现在可以这样做，删除此答案并将信息添加回你的问题。你应该用新的细节编辑你的问题，而不是回答你自己的问题如果这不是答案，你现在可以通过删除编辑此答案并将信息添加回您的问题

$('.left-col p').hide();
$('.left-col h2').click(function(){
    $(this).nextUntil('h2').toggle();
});

<script type="application/javascript">
    $(document).ready(function() {

    var al = $('.text');

    $('h2').each(function(){
        $('<a>', {
            text: $(this).text(),
            href: '#'
        }).wrap('<li>').parent().appendTo(al);
    });

    $('.text a').click(function(e) {

    e.preventDefault(); 

    // Removes h2 class jump which is added below
    $('h2').removeClass('jump');

    // Grabs the text from this a link that has been clicked
    var alink = $(this).text(); 

    // filters through all h2's and finds a match off text above and add class jump
    $('h2:contains("' + alink +'")').addClass("jump");

    // scrollto the h2 with the class jump
    $('html,body').animate({scrollTop: $("h2.jump").offset().top},'fast');

    return false;

    }); 


    });                  
    </script>