美文网首页
jquery操作css属性

jquery操作css属性

作者: seafruit | 来源:发表于2016-11-04 15:55 被阅读0次

    这里主要说一下,在写nodebb插件的时候,遇到的有关css属性操作的问题。

    W3School上面是这个样子的

    • $(selector).css(name,value)
    $("p").css("color","red");
    
    • $(selector).css(name,function(index,value))
    $("p").css("color",function(){return "red";})
    
    • $(selector).css({property:value, property:value, ...})
    $("p").css({
      "color":"white",
      "background-color":"#98bf21",
      "font-family":"Arial",
      "font-size":"20px",
      "padding":"5px"
      });
    

    使用attr
    attr(name) 取得第一个匹配元素的属性值.

    $("input").attr("value")
    

    将一个"名/值"形式的对象设置为所有匹配元素的属性

    $("input").attr({ value: "txt", title: "text" });
    

    attr(key,value) 为所有匹配的元素设置一个属性值

     $("input").attr("value","txt");
    

    attr(key,fn) 为所有匹配的元素设置一个计算的属性值

    $("input").attr("title", function () { return this.value });
    

    removeAttr(name) 从所有匹配的元素中删除一个属性

    $("input").removeAttr("value");
    

    使用style

    document.getElementById("myDIV").*style*.*display* = "none";
    

    好吧,事实上,我这些都尝试了,最后选用了.css来操作属性。但还是有疑问,为什么.attr就不可以呢?

    css("color","red");这样可以用的。但是attr("color","red")好像不可以这样用,attr的作用就是有一些html元素的属性jquery没有去封装,然后你又想用这些属性,就可以用attr,但是jquery都给你封装了css你在用attr("color","")就不产生效果了。

    jquery中的css()是用来操纵style{}的,而attr()是加在标签内部的 。所以利用attr()修改的样式会优先css()修改的样式。

    相关文章

      网友评论

          本文标题:jquery操作css属性

          本文链接:https://www.haomeiwen.com/subject/ckteuttx.html