码迷,mamicode.com
首页 > Web开发 > 详细

jQuery之dom操作(取赋值方法)

时间:2018-12-24 02:39:12      阅读:229      评论:0      收藏:0      [点我收藏+]

标签:的区别   disable   dom   ul li   lse   状态   区别   方案   name   

取赋值相关方法:

                  .html() .text() .size()
                  .addClass() .removeClass() .hasClass()
                  .css()
                  .attr() .prop()
注意:
     1、尽量避免直接添加行间样式,因为其权重过高,这样不利于响应式设计,破坏了c3 + h5 优雅的解决方案
     2、attr和prop的区别:jQuery认为attribute的checked selecked disabled 就是表示该属性初始状态的值,property的checked、selecked、disabled表示该属性实时状态的值
    (true或false)
 
1、.html( )  (即可取值又可赋值)
    <ul>
        <li>1</li>
        <li>2</li>
        <li>3</li>
        <li>4</li>
        <li>5</li>
    </ul>
    <script src = "./jquery.js"></script>
    <script> 
        $(‘ul‘).html();  //取值 (ul里的li全部取)
        $(‘ul li‘).html(); //只取第一个li

        //innerHTML
        $(‘ul‘).html(‘‘); //赋值(可传普通字母,也可带标签)

        //还可传函数
        var arrName = [‘周‘,‘王‘,‘张‘,‘白‘,‘刘‘]
        $(‘ul li‘).html(function(index,ele){
           return ‘<p style="color:orange">‘+ arrName[index] + ‘</p>‘
        })

         //赋值时附一个值会把所有的li都赋成9 (取值时取一个,赋值时赋所有)
         $(‘ul li‘).html(‘9‘);
    </script>

2、text( )

    <ul>
        <li>1</li>
        <li>2</li>
        <li>3</li>
        <li>4</li>
        <li>5</li>
    </ul>
    <script src = "./jquery.js"></script>
    <script> 
        // text innerText
        $(‘ul‘).text(); //取值
        $(‘ul li‘).text(); //取值(都取,与html不同)
        //赋值
        $(‘ul li‘).text(‘9‘) //都变9
        $(‘ul‘).text(‘9‘) //覆盖掉 变成一个9
        $(‘ul‘).text(‘<p>3</P>‘) //文本形式的标签
        //也可传函数
        $(‘ul li‘).text(function(index,ele){
            return arrName[index];
        })
    </script>

3、size( )

$(‘ul li‘).size(); //相当于$(‘ul li‘).length

 

 
 

jQuery之dom操作(取赋值方法)

标签:的区别   disable   dom   ul li   lse   状态   区别   方案   name   

原文地址:https://www.cnblogs.com/tianya-guoke/p/10166279.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!