将类应用于<td>
将类应用于<td>
提问于 2015-05-30 22:37:14
如何找到每个<p>元素中包含的<td>元素的类名，然后将该类添加到<td>元素的类列表中？
<table>
<tr>
<td colspan="1">
<p class="Hello_blue">Hello Stack Overflow1</p>
</td>
<td rowspan="1" colspan="2">
<p class="Hello_red">Hello Stack Overflow2</p>
<p class="Hello_red">defines red color,that class want to apply to</p>
</td>
<td rowspan="1" colspan="1">
<p class="Hello_orange">Hello Stack Overflow3</p>
</td>
</tr>
</table><td>元素的类如下所示
<td rowspan="1" colspan="1" class="blue">...</td>
<td rowspan="1" colspan="1" class="red">...</td>
<td rowspan="1" colspan="1" class="orange">...</td>回答 2
Stack Overflow用户
回答已采纳
发布于 2015-05-30 22:54:35
您可以在表中搜索p标记，然后找到最接近的父td并分配类名。
使用普通Javascript的：
// convert "Hello_blue" to "blue"
function convertClassName(src) {
return src.replace(/^.*?_/, "");
}
var pTags = document.querySelectorAll("table p");
for (var i = 0; i < pTags.length; i++) {
pTags[i].parentNode.className += " " + convertClassName(pTags[i].className);
}工作演示：http://jsfiddle.net/jfriend00/6bvwu5qL/
使用jQuery:
// convert "Hello_blue" to "blue"
function convertClassName(src) {
return src.replace(/^.*?_/, "");
}
$("table p").each(function() {
$(this).closest("td").addClass(convertClassName(this.className));
});工作演示：http://jsfiddle.net/jfriend00/36oejbx4/
这些代码块中的任何一个都应该在加载DOM之后运行。这意味着要么将它们放在文档末尾的脚本标记中，要么从加载DOM之后才调用的函数调用它们，或者从等待加载DOM的事件处理程序(如onload)调用它们。
Stack Overflow用户
发布于 2015-05-30 22:53:50
选择作为<p>元素子元素的所有<td>元素，然后迭代并将每个<p>元素的类分配给其父元素。
(function(){
window.onload = function() {
"use strict";
var paragraphs = document.querySelectorAll('td p'), paragraph, i;
for(i = 0; (paragraph = paragraphs[i]); i++) {
paragraph.parentNode.className += paragraph.className.replace('hello_','');
}
}
})();页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/30552047
复制相关文章
相似问题
腾讯云开发者
