Question

我正在使用JavaScript在我的网站上运行一些AB测试。我可以使用<button>更改element.innerHTML = "Text that I want"中的文字，但使用相同的策略我无法更改<input type="submit">中的文字。

相反，我可以使用element.value = "Text that I want"更改提交按钮的值，但不能以这种方式更改<button>的文字。

所以我的问题是，我怎么知道需要在特定元素上使用哪个函数，以便我可以创建一个处理每种元素类型的算法？

简而言之：我如何知道是以编程方式使用element.innerHTML还是element.value？

注意：不允许使用jQuery。

示例 - 以下是一些代码，它将类名作为输入并在整个页面中更改元素。有时<input>可能包含标识类，但有时可能是<div>，<button>或<p>。

var execute = function(experimentName, variation){
        var elements = document.getElementsByClassName(experimentName);
        for (var j = 0; j < elements.length; j++) {
            if (typeof(variation) == "function")
            {
                variation.call(elements[j]);
            }
            else
            {
                elements[j].value = variation;
                //elements[j].innerHTML = variation;
            }
        }
    };

Answer 1

如果您尝试以通用方式执行此操作，则可以对输入元素的interface class进行instanceof检查：

if( element instanceof HTMLInputElement ){
    element.value = "foo";
} else {
    element.innerHTML = "foo";
}

Answer 2

首先，您知道如何在HTML中使用该元素。

innerHTML设置元素的内容; value设置元素的value=""属性。

如何判断我的元素是否需要innerHTML或value

2 个答案: