Question

任何人都可以给我javascipt代码从我的HTML中提取sf_number的以下实例吗？

<ul class="multi_value_field" style="width: 99.5%;">
<li class="choice" choice_id="sf_number">sf_number<a class="close">×</a><input type="hidden" name="ticket[set_tags][]" value="sf_number" style="display: none;"></li>
<li class="search_field_item"><input type="text" autocomplete="off" tabindex="20"></li>
</ul>

基本上我想用不同的sf_number替换所有三个实例另一个领域的价值。这是我尝试提取sf_number的代码但到目前为止无效：

var n2 = document.getElementsByClassName("multi_value_field").getElementsByClassName("choice");

提前致谢

更新如何使用下面的建议更改现有代码？

<html>
<script type="text/javascript">
copy = function()
{
    var n1 = document.getElementById("ticket_fields_20323656");
    var n2 = document.getElementById("choice").getElementsByClassName("sf_number")[0] ;
    n2.value = n1.value;
}
</script>

<input type="button" value="copy" onClick="copy();" />
</html>

更新

这似乎不起作用，是否正确？

<html>
<script type="text/javascript">
copy = function()
{
var fields = document.getElementsByClassName("multi_value_field")[0].getElementsByClassName("choice");

for (var i = 0; i < fields.length; i++)

    fields[i].setAttribute("choice_id", "document.getElementById("ticket_fields_20323656").value");
    fields[i].getElementsByTagName("input")[0].value = "document.getElementById("ticket_fields_20323656").value";
    fields[i].firstChild.nodeValue = "document.getElementById("ticket_fields_20323656").value";
}
</script>

<input type="button" value="copy" onClick="copy();" />
</html>

Answer 1

var n2 = document.getElementsByClassName("multi_value_field")返回节点列表

所以你需要使用for循环迭代列表..

var n2 = document.getElementsByClassName("multi_value_field");

for(var i =0;i< n2.length;i++){
  var $li =  n2[i].getElementsByClassName("choice"); This is again a Node list.

  for(var j = 0;j< $li.length ; j++){
     $li[j] // This the li in question
  }
}

<强>更新

var n1 = document.getElementById("ticket_fields_20323656"); 
var n2 = document.getElementById("choice").getElementsByClassName("sf_number");
// The above line again return's node List .... 
n2.value = n1.value;

如果您觉得它有一个单独的类

，请用此行替换它

var n2 = document.getElementById("choice").getElementsByClassName("sf_number")[0] ;

但问题是我在id="choice"

中看不到HTML.的元素

Answer 2

试试这段代码。你还想替换文字吗？

<script>
var fields = document.getElementsByClassName("multi_value_field")[0].getElementsByClassName("choice");

for (var i = 0; i < fields.length; i++)
{
    fields[i].setAttribute("choice_id", "something else");
    fields[i].getElementsByTagName("input")[0].value = "something else";
    fields[i].firstChild.nodeValue = "something else";
}
</script>

Answer 3

我不确定我理解你的问题。

没有名为“choice_id”的HTML属性，使用非标准属性不是一个好主意。如果你想使用值'sf_number'来识别许多元素，你应该使用一个类，例如。

<li class="choice sf_number">sf_number<a class="close">×</a>...</li>

现在，您可以使用getElementsByClassName或querySelectorAll获取类别为“sf_number”的所有元素。您可以为其中一个或两个添加填充物以使生活更轻松，然后使用：

var sfNumbers = document.querySelectorAll('.sf_number');

然后你可以按照其他答案迭代收集。

一个元素可以有多个类，上面只选择那些类为'sf_number'的类。如果要选择文本sf_number，最好将其放在span或类似元素中，以便更直接地引用它。依靠不同的浏览器来一致地插入文本节点并不是一个好主意。

Javascript：如何调用<li>元素值</li>

3 个答案: