zoukankan      html  css  js  c++  java
  • jQuery中操作属性的方法attr与prop的区别

    attr 与 prop 都可以对某个属性进行获取和设置的操作,二者的用法相同:

    <script src = 'jQuery.js'></script>
    <script>
    
        
        // attr:
        // 设置单个属性
        $(element).attr(name,value);
    
        // 设置多个属性
        $(element).attr(obj);
    
        // 获取属性
        $(element).attr(name);
    
    
        // prop:
        // 设置单个属性
        $(element).prop(name,value);
    
        // 设置多个属性
        $(element).prop(obj);
    
        // 获取属性
        $(element).prop(name);
    </script>

    用处和区别却是不一样的,对于返回值是布尔类型的属性,如:disabled, checked只能使用 prop 进行操作,当然更大的区别在于,attr 操作的是写在元素内的字面属性,而 prop 操作的是元素的 DOM 属性:

    <body>
    
        // 以访问网站的形式打开页面
    
        // 例:假设文件在C盘中,上层主目录文件夹为 folder-min
        <img id="img" src="/folder/image.jpg" />
    
        <input id="check1" type="checkbox" checked="checked" />
    
        <input id="check2" type="checkbox" />
    <script>
        $( '#img' ).attr( 'src' );  // 控制台输出:"/folder/image.jpg"
        $( '#check' ).prop( 'src' );  // "http://folder-min/folder/image.jpg"
    
        $( '#check1' ).attr( 'checked' );  // checked
        $( '#check1' ).prop( 'checked' );  // true 或 false 取决于复选框状态
    
        $( '#check2' ).attr( 'checked' );  // undefined
        $( '#check2' ).prop( 'checked' );  // true 或 false 取决于复选框的状态
    </script>
    </body>
  • 相关阅读:
    高兴啊~~新博皮诞生咯~~
    不同的手机用户被表现
    这是荷塘月色另外的一种风格代码,要的拿。。。。记得禁止默认CSS
    开始做新博皮!@
    哎,回来拉
    漂亮!正常咯~~!~
    郁闷,垃圾CSS!
    新开始,新起航。。
    Debug!Debug!Debug!
    Dubbo源码学习总结系列一 总体认识
  • 原文地址:https://www.cnblogs.com/schuan/p/12829206.html
Copyright © 2011-2022 走看看