[封装插件]使用Jquery实现点击就更换指定内容

最新推荐文章于 2023-02-13 09:11:10 发布

Byte_Dance

最新推荐文章于 2023-02-13 09:11:10 发布

阅读量474

点赞数

分类专栏： Jquery

本文链接：https://blog.csdn.net/Byte_Dance/article/details/79319088

版权

Jquery 专栏收录该内容

44 篇文章 0 订阅

订阅专栏

先使用给标签添加属性的方法，然后再获取属性改变内容，比如给H1标签添加一个名称属性，然后再通过点击获取这个属性并赋值给里边的内容。弊端：标签属性一旦添加的过多，标签就会变得很臃肿，不利于将来查看代码

<！DOCTYPE HTML >
 <HTML LANG = “EN” >
 <HEAD>
     <元的charset = “UTF-8” >
     <TITLE>使用Jquery的单独实现单击换行号</ TITLE>
 <！ -百度在线压缩地址- - >
 <script src = “http://libs.baidu.com/jquery/1.7.2/jquery.min.js” > </ script>
 </ head>
 <body>
     <h1> aaaa </ h1>
     < h1> bbbb </ h1>
     <h1> cccc </ h1>
     <h1> dddd </ h1>
     <h1> eeee </ h1>
     <script>
 / ***
        

                 *实现单击换行号主要用到两种方法
          * 1：利用each（）循环方法给获取的h1元素都添加一个属性
          * 2：利用click（）方法改变点击到元素里边的内容
          * /
 //这一次我们要单独使用jquery来实现换行号这个功能
         //先给h1添加一个名称属性并赋值
 $（ “h1”）。每个（
                函数（I）{
 //遍历到那个$（本）就表示那个
 $（本）。 ATTR（{ “姓名”：ⅰ+ 1 }） ;
 }                                                    
        ）;
//再给每个元素添加一个click事件
 $（“h1”）。点击（
                 函数（）{
                     $（this）。html（$（this）。attr（“name”））;
 }                                
        ）;
</ script>
 </ body>
 </ html>

另一种方法：通过给获取的jquery元素添加属性，然后需要点击的时候再获取这个属性的值; 优点：不会改变标签本身的属性值，很简洁

<！DOCTYPE HTML >
 <HTML LANG = “EN” >
 <HEAD>
     <元的charset = “UTF-8” >
     <TITLE>使用Jquery的单独实现单击换行号</ TITLE>
 <！ -百度在线压缩地址- - >
 <script src = “http://libs.baidu.com/jquery/1.7.2/jquery.min.js” > </ script>
 </ head>
 <body>
 <h1> aaaa </ h1>
 < h1> bbbb </ h1>
 <h1> cccc </ h1>
 <h1> dddd </ h1>
 <h1> eeee </ h1>
 <script>
 / ***
      *实现单击换行号主要用到两种方法
      * 1：利用each（）循环方法给获取的h1元素都添加一个属性
      * 2：利用click（）方法改变点击到元素里边的内容
      * /
 //这一次我们要单独使用jquery来实现换行号这个功能
         //先给h1添加一个名称属性并赋值
 $（“h1”）。每个（
             函数（I）{
 //遍历到那个$（本）就表示那个
 $（这个）。数据（{ “姓名”：ⅰ+ 1 }）;
 }        

                                            
    ）;
//再给每个元素添加一个click事件
 $（“h1”）。click（
             function（）{
                 $（this）。html（$（this）。data（“name”））;
 }                    
    ）;
</ script>
 </ body>
 </ html>

Byte_Dance

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
[封装插件]使用Jquery实现点击就更换指定内容

先使用给标签添加属性的方法，然后再获取属性改变内容，比如给H1标签添加一个名称属性，然后再通过点击获取这个属性并赋值给里边的内容。弊端：标签属性一旦添加的过多，标签就会变得很臃肿，不利于将来查看代码&lt;！DOCTYPE HTML &gt; &lt;HTML LANG = “EN” &gt; &lt;HEAD&gt; &lt;元的charset = “UTF-8” &gt; ...
复制链接

扫一扫

专栏目录