gpt4 book ai didi

javascript - 简单的第一个 child js?

转载 作者:行者123 更新时间:2023-12-02 20:39:35 24 4
gpt4 key购买 nike

通过 javascript 搜索简单的第一个 child 检测(无框架)。

它应该为元素的第一个子元素添加类“first ”。类似于 ie 的 css-hacks,但在 javascript 和 html 文件中。

工作方式必须类似于:first-child

当我说没有框架时,我指的是像这样的代码:

<script type="text/javascript">document.documentElement.id = "js"</script>
<小时/>

例如:

<div class="terms">
<dl>
<dt>Term 1 name</dt>
<dd>Term 1 description</dd>
</dl>
<dl>
<dt>Term 2 name</dt>
<dd>Term 2 description</dd>
</dl>
<dl>
<dt>Term 3 name</dt>
<dd>Term 3 description</dd>
</dl>
</div>

<dl> ,第一个包括第 1 项。

此 css 在 IE6 中不起作用,这就是我正在寻找 javascript 解决方案的原因。 CSS 黑客行为是不允许的。

.terms dl:first-child { float: right; }

最佳答案

这将执行您想要的操作,但您确实需要向 div 添加一个 id 以便于查找它。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<style type="text/css">
.terms { }
.terms dl.first { float: right; }
</style>
</head>
<body>
<div id="terms" class="terms">
<dl>
<dt>Term 1 name</dt>
<dd>
Term 1 description</dd>
</dl>
<dl>
<dt>Term 2 name</dt>
<dd>
Term 2 description</dd>
</dl>
<dl>
<dt>Term 3 name</dt>
<dd>
Term 3 description</dd>
</dl>
</div>
</body>

<script type="text/javascript">

function firstChild(element) {
for (var i = 0; i < element.childNodes.length; i++) {
var child = element.childNodes[i];
if (child.nodeType == 1) {
return child;
}
}
}
var terms = document.getElementById("terms");

firstChild(terms).className += " first";

</script>

</html>

引用:

nodeType Constants
  
ELEMENT_NODE : 1 ATTRIBUTE_NODE : 2 TEXT_NODE : 3 CDATA_SECTION_NODE : 4 ENTITY_REFERENCE_NODE : 5 ENTITY_NODE : 6 PROCESSING_INSTRUCTION_NODE : 7 COMMENT_NODE : 8 DOCUMENT_NODE : 9 DOCUMENT_TYPE_NODE : 10 DOCUMENT_FRAGMENT_NODE : 11 NOTATION_NODE : 12

关于javascript - 简单的第一个 child js?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/2705215/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com