Name
可不是 注意JavaScript使用
是Name去访问属性
是
个保留关键字将来JavaScript可能开始支持像Java样类
我们在讨论style属性时遇到了棘手
细节问题和浏览器差异性带来麻烦正如同经历场惊涛骇浪而和id更改则像是沙漠里片平静绿洲浏览器们在这里和谐相处研究这个例子: p {
color: #000000; /* black */
}
p.emphasis {
color: #cc0000; /* red */
}
<p id="test">Test</p>
最初
该段落没有定义所以它字体颜色是黑色不过行JavaScript就足以改变它样式: document.getElementById('test').
Name = 'emphasis'; 瞬间文字变成了红色
如果想要改变回来你可以按如下操作: document.getElementById('test').
Name = ''; 你移除了样式
该段落恢复到默认p{}规则 对于
个实际应用中例子看看“限长文本输入区”计数器有这样结构和呈现样式(该结构由JavaScript动态生成不过那不影响这个例子): <div
="counter"><span>12</span>/1250</div> div.counter {
font-size: 80%;
padding-left: 10px;
}
span.toomuch {
font-weight: 600;
color: #cc0000;
}
当脚本发现用户输入
文字定达到了最大长度它修改作为计数器<span>为toomuch: [限长
文本输入区第20～23行] 
(currentLength > maxLength) this.relatedElement.
Name = 'toomuch'; 
this.relatedElement.
Name = ''; 现在
作为计数器<span>字体变成粗体和红色 id
变更以几乎完全样方式工作: p {
color: #000000; /* black */
}
p#emphasis {
color: #cc0000; /* red */
}
<p>Test</p>
document.getElementsByTagName('p')[0].id = 'emphasis';
该段落
文字再次变成了红色但是我建议你不要过多改变id除了作为CSS钩子它们也常常作为JavaScript钩子改变它们可能存在不确定副作用 增加
通常
你不会给个元素设置新值而只是添加个你不希望移除元素已经拥有任何样式CSS允许复合样式新所包含样式被添加到元素上不会移除任何已经存在CSS指令 “表单验证”中
writeError
和removeError
是个很好例子般来说我会给表单域应用好几个图形设计师经常对输入框使用两个甚至 3个宽度当个表单域包含
时候我希望添加个特别警告样式但我不希望搅乱该元素已经拥有样式所以我不能简单地覆盖旧值那样我将失去已经指定宽度 看这样
情形: <input
="smaller" name="name" /> input.smaller {
width: 75px;
}
input.errorMessage {
border-color: #cc0000;
}
最开始
输入框宽度是75px如果脚本设置为'errorMessage'并且删除旧值表单域会得到个红色边框但也失去了它宽度而那样话可能会让用户感到非常迷惑 因此
我是添加了errorMessage : [表单验证
第105～106行] function writeError(obj,message) {
obj.
Name 
' errorMessage'; 这段代码取得已存在
Name并在其后附加个新在它的前加个空格这个空格分隔新和任何对象可能已经拥有值现在输入框除了拥有75px宽度的外如我们所愿地得到了红色边框该表单域现在应用了两个HTML就好像这样: <input
="smaller errorMessage" name="name" /> Class在Mozilla中
名称和空白 你可能注意到removeError
移除值errorMessage时候没有前置空格那是个浏览器bug当你添加errorMessage到个原来没有值时候Mozilla会删除前置空格如果我们随后执行replace(/ errorMessage/,'')Mozilla不能移除它找不到
串errorMessage前置空格已经不在了 移除
旦用户修正了她值errorMessage应该被移除但任何原来比如smaller不应该受到影响removeError提供了这个功能: [表单验证
第119～120行] function removeError
{ this.
Name = this.Name.replace(/errorMessage/,''); 它先取得元素
然后替换串'errorMessage'为''(个空)errorMessage从值中被取走但对其他值没有影响表单域失去了红色边框颜色但依然维持75px宽度
最新评论