Javascript 如何设置表格的边框
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/8507079/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to set Border for table
提问by S.P
I am trying to develop a web page using HTML and JavaScript languages.
我正在尝试使用 HTML 和 JavaScript 语言开发网页。
And I have been also using external Javascript and External style sheets for development.
我也一直在使用外部 Javascript 和外部样式表进行开发。
The problem is while using external style sheets in Javascript, I want to give some border for the table and its rows and cols.
问题是在 Javascript 中使用外部样式表时，我想为表格及其行和列提供一些边框。
Can anyone tell me how can I do that?
谁能告诉我我该怎么做？
回答by balkon_smoke
HTML elements have property stylethat represents object with element's styles. If you modify it — you'll change style of your element.
HTML 元素具有style表示具有元素样式的对象的属性。如果您修改它 - 您将更改元素的样式。
elem.style.border = "1px solid #000"
// the same as
elem.style.borderWidth = "1px";
elem.style.borderColor = "#000";
elem.style.borderStyle = "solid";
// or
elem.style.borderTop = "4px dashed greed";
// the same as
elem.style.borderTopWidth = "4px";
elem.style.borderTopColor = "green";
elem.style.borderTopStyle = "dashed";
Using borderTop, borderRight, borderBottom, borderLeftproperties you can change only borders what you need.
使用borderTop, borderRight, borderBottom,borderLeft属性，您只能更改所需的边框。
回答by Mike Sav
Try something like this in your JavaScript:
在你的 JavaScript 中尝试这样的事情：
object.style.border="1px solid red"; // 1px solid red can be anything you want...
W3schools can help you here: http://www.w3schools.com/cssref/pr_border.asp
W3schools 可以在这里为您提供帮助：http: //www.w3schools.com/cssref/pr_border.asp
Just to confirm object in this example represents some this you have selected using getElementById, so...
只是为了确认这个例子中的对象代表了你选择使用的一些对象getElementById，所以......
var myTable = document.getElementById('tableID');
myTable.style.border="1px solid red";
回答by mas-designs
Why don't you use the jQuery Framework ? With jQuery you would be able to add the following code to achieve your goal:
为什么不使用 jQuery 框架？使用 jQuery，您可以添加以下代码来实现您的目标：
$('table').css("border","1px solid #000");
回答by S.P
I got it.
我知道了。
In your CSS file code table: td{border:1pix solid red}.
在你的CSS文件代码表：td{border:1pix solid red}。
Here 1pix=gives your choice of border size, but it should be in the same format. I think solid=is intensity of color. If you want to try something else, refer to w3schools/table. red=Color name(you can give any desired color name).
If you want to give the color name in hexadecimal, just replace "red" with some hexadecimal value like "#cdcdcd"(it's not black).
这里1pix=提供了您选择的边框大小，但它应该是相同的格式。我认为solid=是颜色的强度。如果您想尝试其他东西，请参阅w3schools/table。red=Color name（您可以提供任何所需的颜色名称）。如果你想以十六进制给出颜色名称，只需用一些十六进制值替换“红色” "#cdcdcd"（它不是黑色）。
If you still have doubt, just approach me.
如果你还有疑问，就来找我吧。
回答by JDGuide
Try this in Javascript:-
试试这个Javascript： -
elemt.style.borderBottom="1px solid red";
elemt.style.borderTop="1px solid green";
In CSS:-
在CSS：-
.your-element{
border-top:1px solid green;
border-left:1px solid red;
}
Works fine. The CSSstyle of writing and Javascriptstyle of writing is bit different.
工作正常。在CSS写作和风格Javascript的写作风格有点不同。
