$("#userLevelCss").attr("style","width:78%;float: right;display: none;");、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、
记录一下用JavaScript原生代码 以及jQuery 设置/获取 属性的方法：
（文章最下面有完整版代码）
首先把JavaScript的奉上
function attribute() { ???????var val=document.getElementById("in1").value, ???????????a1=document.getElementById("a1"), ???????????d2=document.getElementById("d2"); ???????//第一种直接设置本身自有属性方法 ???????a1.href="https://www."+val+".com"; ???????//第二种设置自定义属性方法 ???????d2.setAttribute("url","https://www."+val+".com"); ???????//获取选中属性的值 ???????var d1Url=d1.getAttribute("url"); ???????console.log(d1Url); ???????//设置样式 ???????d2.style.background="#FAB2C9"; ???}- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
运行结果如下：
再来就是jQuery的
???????//设置属性、值 ???????$("#a2").attr("href","http://www.w3school.com.cn/"); ???????//同时设定多个 ???????$("#a2").attr({ ???????????"data-num":"50", ???????????"target":"view_window" ???????}); ???????//获取选择属性的值： ???????var a2Href=$("#a2").attr("href"); ???????console.log("a2链接地址为："+a2Href); ???????//设定样式 ???????$("#d2").css("border","5px solid #8E00FF"); ???????//同时设定多个 ???????$("#d2").css({ ???????????"width" : "200", ???????????"height" : "50", ???????????"background":"#E058EA" ???????});- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 22
- 23
运行结果如下：
整篇代码
<!DOCTYPE html><html><head lang="en"> ???<meta charset="UTF-8"> ???<title></title> ???<style> ???????#d1{ ???????????width:200px;height:50px; ???????} ???</style></head><body><div> ???<h3>JavaScript</h3> ???<input type="text" id="in1" ?value="baidu"/> ???<div id="d1"></div> ???<a href="#" id="a1">超链接</a></div><hr><div> ???<h3>jQuery</h3> ???<a href="#" id="a2">点我跳转</a> ???<div id="d2"></div></div><script> ???function attribute() { ???????var val=document.getElementById("in1").value,a1=document.getElementById("a1"),d1=document.getElementById("d1"); ???????//第一种设置本身自有属性方法 ???????a1.href="https://www."+val+".com"; ???????//第二种设置自定义属性方法 ???????d1.setAttribute("url","https://www."+val+".com"); ???????//获取选中属性的值 ???????var d1Url=d1.getAttribute("url"); ???????console.log(d1Url); ???????//设置样式 ???????d1.style.background="#FAB2C9"; ???} ???attribute();</script><script src="jquery-1.12.4.min.js"></script><script> ???????//设置属性、值 ???????$("#a2").attr("href","http://www.w3school.com.cn/"); ???????//同时设定多个 ???????$("#a2").attr({ ???????????"data-num":"50", ???????????"target":"view_window" ???????}); ???????//获取选择属性的值： ???????var a2Href=$("#a2").attr("href"); ???????console.log("a2链接地址为："+a2Href); ???????//设定样式 ???????$("#d2").css("border","5px solid #8E00FF"); ???????//同时设定多个 ???????$("#d2").css({ ???????????"width" : "200", ???????????"height" : "50", ???????????"background":"#E058EA" ???????});</script></body></html>jquery如何为元素设置style？
原文地址：https://www.cnblogs.com/YuyuanNo1/p/9258988.html