我可以将CSS样式应用于元素名称吗?
我目前正在一个项目中,我无法控制我正在使用CSS样式的HTML。 而HTML没有被很好的标记,因为没有足够的id和class声明来区分元素。
所以,我正在寻找可以将样式应用于没有id或class属性的对象的方法。
有时,表单项具有“名称”或“值”属性:
<input type="submit" value="Go" name="goButton">
有没有一种方法可以应用基于name =“goButton”的样式? 那么“价值”呢?
这是很难find的东西,因为谷歌search会发现各种各样的实例,其中“名称”和“价值”等广泛的术语将出现在网页中。
我有点怀疑答案是否定的,但也许有人有一个聪明的黑客?
任何build议将不胜感激。
你可以使用属性select器, input[name="goButton"] { }
。 请注意,它在IE6中不受支持。
更新:在2016年,你几乎可以使用它们,因为IE6已经死了。 http://quirksmode.org/css/selectors/
文本input示例
input[type=text] { width: 150px; } input[name=myname] { width: 100px; }
你可以使用属性select器,但他们不会在IE6像meder说,有JavaScript的解决方法,寿。 检查Selectivizr
更详细的属性select器: http : //www.css3.info/preview/attribute-selectors/
/* turns all input fields that have a name that starts with "go" red */ input[name^="go"] { color: red }
对于将来的googlers,FYI,@meder答案中的方法可以用于任何具有name属性的元素,所以让我们说一个名为xyz
的<iframe>
,然后你可以使用下面的规则。
iframe[name=xyz] { display: none; }
name
属性可用于以下元素:
-
<button>
-
<fieldset>
-
<form>
-
<iframe>
-
<input>
-
<keygen>
-
<map>
-
<meta>
-
<object>
-
<output>
-
<param>
-
<select>
-
<textarea>
如果我理解你的问题,那么,
是的,你可以设置单个元素的风格,如果它的ID或名称是可用的,
例如
如果id可用,那么你可以控制的元素,
<input type="submit" value="Go" name="goButton"> var v_obj = document.getElementsById('goButton'); v_obj.setAttribute('style','color:red;background:none');
否则,如果名称是可用的,那么你可以控制这个元素,
<input type="submit" value="Go" name="goButton"> var v_obj = document.getElementsByName('goButton'); v_obj.setAttribute('style','color:red;background:none');
你有没有探究使用jQuery的可能性? 它有一个非常到位的select器模型(在语法上与CSS类似),即使你的元素没有ID,你也应该能够使用父 – >子 – >孙的关系来select它们。 一旦你select了它们,就有一个非常简单的方法调用(我忘记了确切的名称),允许你将CSS样式应用到元素上。
它应该很简单,作为奖励,你很可能是跨平台兼容的。