js对象转jQuery对象,$('num'),
jQuery对象转js对象,$('num')[0],或$('num').get(0)。
1.点击换行,each(),html(),attr(),每个h1标签添加一个num来实现
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Document</title> 6 <script src="jquery.js"></script> 7 </head> 8 <body> 9 <h1>aaaaaaaaaaaaaaaaaaaaaa</h1> 10 <h1>aaaaaaaaaaaaaaaaaaaaaa</h1> 11 <h1>aaaaaaaaaaaaaaaaaaaaaa</h1> 12 <h1>aaaaaaaaaaaaaaaaaaaaaa</h1> 13 <h1>aaaaaaaaaaaaaaaaaaaaaa</h1> 14 <h1>aaaaaaaaaaaaaaaaaaaaaa</h1> 15 16 </body> 17 <script> 18 //点击显示行号 19 //each循环,函数可传参i 20 //每个h1标签添加num属性,赋值为i+1 21 $('h1').each(function(i){ 22 $(this).attr('num',i+1); 23 }); 24 //点击每个h1标签,让标签内部文字变成num的值 25 $('h1').click(function(){ 26 $(this).html($(this).attr('num')); 27 }); 28 </script> 29 30 </html>
2. 点击换行,data()方法
1 <script> 2 $('h1').each(function(i){ 3 //data方法是生成一个标签,后面是他的值 4 $(this).data('num',i+1);; 5 }); 6 $('h1').click(function(){ 7 //使用data里面的num标签的值 8 $(this).html($(this).data('num')); 9 }); 10 </script>