怎么用JS给一个HTML元素增加一个属性和值

[siaosa]

有这样的HTML代码
<select style="width: 120px;" id="dp" name="dp" value="-1" onchange="funAlert(this)">
<option value="-1" selected="selected"></option>
<option value="1">WA1</option>
<option value="2">OR2</option>
<option value="3">AZ3</option>
<option value="4">UT4</option>
<option value="5">IA5</option>
<option value="6">MD6</option>
</select>

现在想在funAlert函数中实现这样的功能. 用户选择select中的一项之后HTML代码变成 选项的值,例如
选择WA1,那么增加:value="1"
选择OR2,那么增加:value="2"
.....
完整的HTML
<select style="width: 120px;" id="dp" name="dp" value="选项的值" onchange="funAlert(this)">
这样的JS函数要怎么写啊?不会往HTML里增加一个属性和值

[wohaishiliumang]

2,3楼正解. 赋值有很多种方法.

[siaosa]

T5500
我按您的方法这样做. 按鼠标右键,然后看生成的HTML代码,HTML的代码并没有改变啊?

[siaosa]

按鼠标右键,看生成的HTML代码,不管你选哪个选项,永远是:
<select style="width: 120px;" id="dp" name="dp" value="-1" demo="-1" onchange="funAlert(this)">

[001007009]

查看页面html代码 显示的是 加载时的html结构/值， 之后通过js来操作再查看页面html代码是没有变化的。
楼主 要看 dom的实时变化，可以下个firebug 来看。

[JJYY0088]

[Quote=引用 6 楼 的回复:]
查看页面html代码 显示的是 加载时的html结构/值， 之后通过js来操作再查看页面html代码是没有变化的。
楼主 要看 dom的实时变化，可以下个firebug 来看。
[/Quote]
+++

用火狐插件：firebug 才可以看到。。。。

[licip]

+1[Quote=引用 2 楼 的回复:]

HTML code
<select style="width: 120px;" id="dp" name="dp" value="-1" onchange="funAlert(this)">
<option value="-1" selected="selected"></option>
<option value="1">WA1</option>
<option value="2……
[/Quote]

[suano]

<select style="width: 120px;" id="dp" name="dp" value="-1" onchange="funAlert(this.value)">

funAlert(o)
{
document.getElementById("你要赋值的对象ID").innerHTML==o;
}

[乌镇程序员]

<select style="width: 120px;" id="dp" name="dp" value="-1" onchange="funAlert(this)">
  <option value="-1" selected="selected"></option>
  <option value="1">WA1</option>
  <option value="2">OR2</option>
  <option value="3">AZ3</option>
  <option value="4">UT4</option>
  <option value="5">IA5</option>
  <option value="6">MD6</option>
</select>

<script type="text/javascript">
function funAlert(obj) {
	obj.setAttribute('demo', obj.value); //setAttribute设置自定义属性
	alert(obj.getAttribute('demo')); //getAttribute获取自定义属性的值
	alert(obj.getAttribute('value')); //由于没有用setAttribute('value', obj.value)修改自定义属性value的值，所以一直都是-1
	alert(obj.value); //直接获取select对象的value值，返回当前选中的option的值
}
</script>

value属性比较特殊，尽管value属性不是select元素的标准属性，但在JS中是可以通过select对象.value来获取选定值的，通过这种方法取得的value值实际上是所选择的option的value值。
像你这样直接在select标签的html代码中设置了一个value属性，JS仍然会把它当作是自定义属性。所以就出现了例子中这个比较“奇怪”的现象。