Question

我学习JS，有点困惑）我尝试按类名选择页面中的所有元素，在其中找到具有type=hidden的输入，并将输入值取为变量。

为了更清楚，我将展示演示html。

<div class="demo_class">
   <p>lorem ipsum</p>
   <input type="hidden" value="some-value">
</div>
<div class="demo_class">
   <p>lorem ipsum</p>
   <input type="hidden" value="some-value">
</div>
<div class="demo_class">
   <p>lorem ipsum</p>
   <input type="hidden" value="some-value">
</div>
<div class="demo_class">
   <p>lorem ipsum</p>
   <input type="hidden" value="some-value">
</div>

还有一些JavaScript

var container = document.getElementsByClassName("demo_class");
for (var i = 0; i < container.length; i++) {
    var inputValue = container[i].querySelectorAll("input[type=hidden]");
    container[i].insertAdjacentHTML(
        'afterbegin', 
        '<a href ="' + inputValue + '">Some text</a>'
   );
}

在此代码中，我发现所有demo_class，每个input[type=hidden]都找到了inputValue.value，但我无法对其进行任何操作..代码

private void createDirectory() { try { String s = Environment.getExternalStorageDirectory().getAbsolutePath() + File.separator + "Android" + File.separator + "data" + File.separator + getPackageName(); File dir = new File(s); if (dir.mkdir()) { System.out.println("Directory created"); } else { System.out.println("Directory is not created"); } } catch (Exception e) { e.printStackTrace(); Log.e("FILE", "Error Package name not found ", e); } }未定义。为什么？我做错了什么？

我不需要jQuery，想学习JavaScript。

Answer 1

你没有得到价值，而是自己的元素。

替换

var inputValue =   container[i].querySelectorAll("input[type=hidden]");

与

var inputValue =   container[i].querySelectorAll("input[type=hidden]")[0].value;

querySelectorAll（） - 重新搜索结果数组（如果找到一个元素，则为事件）

.value - 设置/检索特定元素值的属性

请参阅此处的工作示例 - here

Answer 2

我认为您的问题取决于DOMContentLoaded事件，当您执行代码时，该事件尚未触发...

function ExampleCtrl() {
  'use strict';
  var self = this;
  
  self.hiddenInputs = document.querySelectorAll('[type="hidden"]');
  self.result = document.getElementById('result');
  
  for(var input, tpl, i = 0, len = self.hiddenInputs.length; i < len; i++) {
    input = self.hiddenInputs[i];
    tpl = '<span class="key">'+ (i + 1) +'</span><span class="value">'+ input.value +'</span>';
    
    self.result.innerHTML += '<h1>'+ tpl +'</h1>';  
  }
}

document.addEventListener('DOMContentLoaded', ExampleCtrl);

#result {
  padding: 1em .5em;
}

#result .key { 
  font-weight: bolder;
  display: inline-block;
  padding-right: 2em;
}
#result .value {
  font-style: italic;
}

<div class="demo_class">
   <p>lorem ipsum</p>
   <input type="hidden" value="some-value">
</div>
<div class="demo_class">
   <p>lorem ipsum</p>
   <input type="hidden" value="some-value">
</div>
<div class="demo_class">
   <p>lorem ipsum</p>
   <input type="hidden" value="some-value">
</div>
<div class="demo_class">
   <p>lorem ipsum</p>
   <input type="hidden" value="some-value">
</div>

<div id="result">
  
</div>

循环获取input.value

2 个答案: