Question

我试图在Ruby on Rails / AngularJS网站的职业页面上包含iframe，该网站在加载时动态注入页面。目前，iframe.js文件选择名为＆＃34; jv-careersite＆＃34;的div。并将iframe放在该div中。我的问题是提供的javascript使用querySelector（）并返回null。所以我将querySelector（）替换为getElementsByClassName（），并返回带有我需要的元素的HTML Collection。

我已将Javascript文件放在public / app / scripts中，并在application.html.erb中包含指向它的链接。当我检查开发工具时，iframe.js文件加载200 OK，内容类型确实是javascript。那么这里的问题是什么？

HTML

<div class="careers-iframe">
    <div class="jv-careersite" data-careersite="companyname"></div>
</div>

Javascript

(function(win) {

var anchor, el, src, baseUrl, optionMap, path;

optionMap = {
    'data-category': 'c',
    'data-department': 'd',
    'data-location': 'l',
    'data-region': 'r',
    'data-subsidiary': 's',
    'data-type': 't'
};

el = document.querySelector('.jv-careersite');
console.log(el);
if (!el) {

    return;
}

if (!el.getAttribute('data-careersite')) {
    warn('Jobvite: no careersite detected!');
    return;
}

Answer 1

相当于以下代码：

el = document.querySelector('.jv-careersite');

类似于（querySelector而不是querySelectorAll）：

el = document.getElementsByClassName('.jv-careersite')[0];

可能的原因是，您可能错过了[0]，而HTMLCollection则会HTMLElement而不是getElementsByClassName()。

或相反。如果[0]工作，然后在内部，某处，则会附加null，后者会返回undefined或var obj = {}, // Note {}, not [] final_array = []; obj["ok"] = "ok"; obj["not_ok"] = "not_ok"; final_array.push(obj); console.log(JSON.stringify(final_array));。

为什么getElementsByClassName（）工作而不是querySelector（）？

1 个答案: