javascript - 是否可以使用 `setAttribute` 设置超链接的文本或内部文本

Question

我正在尝试将描述性 JSON 对象动态转换为 HTML。这不是一件容易的事，但由于它只用于一个小项目和一个小团队，所以它适合我们的需求。

这意味着 JSON 对象可能看起来像

'element': {
            'href': '#03',
            'text': 'link',
            'myUniqueTag' : 'a'
        }

这意味着我可以使用 myUniqueTag 并了解我正在处理 a 类型。这工作得很好。

我遇到的问题是设置文本的值，即

<a href="blah">How do I set this bit</a>

这是我尝试过的

one.text = "Hello world";                           //works
two.innerText = "Hello world";                      //works
three.setAttribute("text", "Hello world");          //fails
four.setAttribute("innerText", "Hello world");      //fails

JSFIDDLE

对于我的情况，我必须使用 setAttributes。我的问题是，我是否遗漏了某些内容，或者是否无法通过 setAttribute()

设置文本

请注意，我仅使用普通 JavaScript(没有 JQuery 或框架)。

Answer 1

当然你可以使用setAttribute来设置文本，但是你需要精确设置你设置的属性。在您的示例中，“text”和“innerText”不是 html 属性。

例如:

JS:

var b = document.createElement('button'); 
b.setAttribute('content', 'test content'); 
b.setAttribute('class', 'btn'); 
b.innerHTML = 'test value';

var wrapper = document.getElementById("divWrapper");
wrapper.appendChild(b);

在 DOM 中看起来像这样:

<div id="divWrapper">
    <button content="test content" class="btn">test value</button>
</div>