Javascript 使用jQuery遍历DOM

我试图为我自己的一个项目创建一个歌词网站，但我在jQuery方面遇到了一些问题。我能够得到艺术家的名字和歌曲，但是歌词被封装在这个div中，很难从中提取数据。我正在发布HTML示例、我的代码和正在记录的for循环中的一个迭代

本质上，我试图用内联样式在div中输入所有歌词，但是我正在打印到控制台的对象采用下面显示的对象的形式。我想我可以在map函数中执行（this.prev（）.data（）），但它似乎不起作用。如果我能参考任何关于如何正确解析的见解或参考资料，我将不胜感激

谢谢大家!

HTML

---

您希望使用

contents（）

获取文本节点，并希望使用map（）将其转换为数组格式。返回

null

将从数组中排除该行

var elems=$（'#main'）.children（）.eq（6）.contents（）.clone（）；
元素查找（“br”）.remove（）；
var text=elems.map（函数（）{
var ln=$.trim（$（this）.text（）.replace（/[“\\n]/g，”））；
返回（项次长度）？项次：空；
}).get（）；
console.log（文本）；

...
艺术家
...
“歌”




"
歌词1“


"
歌词2“


"
歌词3“


“歌词4”

所以，基本上您只需要歌词文本，包括新行字符（

s）？例如，实际的网站也会很好。尝试从这里获取歌词是的，我正在尝试获取没有任何换行符的歌词文本，并感谢epascarello的帮助--非常感谢！我对jQuery非常陌生，但当我尝试使用$.method（）时，我一直遇到这个问题如下所示的符号：var ln=$.trim（$（this）.text（）.replace（/[“\\n]/g，”））；^TypeError:未定义的不是函数

<div id="main">
<div class="...">...</div>
<h2>ARTIST</h2>
<div class="...">...</div>
<b>"SONG"</b>
<br>
<br>
<div style="margin-left:10px;margin-right:10px;">
    <!--start of lyrics -->
    "
    lyric1"
    <br>
    "
    lyric2"
    <br>
    "
    lyric3"
    <br>
    "lyric4"
    etc...
    <!-- end of lyrics -->
</div>

    request(url, function(error, response, html){
    if(!error){
        var $ = cheerio.load(html);
        var artist, song, lyrics;
        var json = { artist : "", song : "", lyrics : []};

        $('#main').filter(function(){
            var data = $(this);
            title = data.find('h2').text().replace(' LYRICS','');
            artist = data.find('b').text().replace(/["]+/g, '');
            var lines = data.children().eq(6).children().map(function() {
                console.log(this)
                console.log("<<<<<<<<<<<<<<<<<<<<<<<<<<<<")
            });
        })
    }
})

{ type: 'tag',
      name: 'br',
      attribs: {},
      children: [],
      next:
       { data: '\nI remember you was conflicted, misusing your influence\r\n',
         type: 'text',
         next:
          { data: ' end of lyrics ',
            type: 'comment',
            next: [Object],
            prev: [Circular],
            parent: [Object] },
         prev: [Circular],
         parent:
          { type: 'tag',
            name: 'div',
            attribs: [Object],
            children: [Object],
            next: [Object],
            prev: [Object],
            parent: [Object] } },
      prev:
       { data: '\nWe want the funk',
         type: 'text',
         next: [Circular],
         prev:
          { type: 'tag',
            name: 'br',
            attribs: {},
            children: [],
            next: [Circular],
            prev: [Object],
            parent: [Object] },
         parent:
          { type: 'tag',
            name: 'div',
            attribs: [Object],
            children: [Object],
            next: [Object],
            prev: [Object],
            parent: [Object] } },
      parent:
       { type: 'tag',
         name: 'div',
         attribs: { style: 'margin-left:10px;margin-right:10px;' },
         children:
          [ bunch of objects within arrays and one [Circular] ]
         next:
          { data: '\r\n\r\n',
            type: 'text',
            next: [Object],
            prev: [Circular],
            parent: [Object] },
         prev:
          { data: '\r\n\r\n',
            type: 'text',
            next: [Circular],
            prev: [Object],
            parent: [Object] },
         parent:
          { type: 'tag',
            name: 'div',
            attribs: [Object],
            children: [Object],
            next: [Object],
            prev: [Object],
            parent: [Object] } } }