无法管理更改div元素的内部html

Question

我无法改变div元素的内部html

<div class="emoji-wysiwyg-editor form-control" data-id="83fa07d0-2bab-4c02-8bb6-a2133ae64bbd"
data-type="input" placeholder="Chat Message" contenteditable="true" id="chatMessageSurrogate"
data-toggle="tooltip" data-placement="top" data-title="Please input a message within 300 
characters." autocomplete="off" style="height: 63px;">wafwafgz</div>

我尝试了以下内容：

$(".emoji-wysiwyg-editor.form-control").val("Hello!")
document.getElementsByClassName(".emoji-wysiwyg-editor.form-control").innerHTML = "Hello!"

但他们都没有工作

Answer 1

$(".emoji-wysiwyg-editor.form-control").html("Hello!");应该有效

Answer 2

如前所述.html（“hello”）应该可以工作，而且，getElementsByClassName我认为只适用于单个类名并返回和数组，所以下面也应该有效

$(".emoji-wysiwyg-editor.form-control").html("Hello!");
// or
document.getElementsByClassName("emoji-wysiwyg-editor")[0].innerHTML = "Hello!"

Answer 3

在您的HTML代码中有两个不同的类“emoji-wysiwyg-editor”和“form-control”。所以你必须使用任何一个。

$(".emoji-wysiwyg-editor").html("Hello!");

$(".emoji-wysiwyg-editor .form-control").html("Hello!");

并且您想在DIV中添加html内容，因此您必须使用html。 val用于输入typt。

Answer 4

在纯JavaScript中使用多个类。

document.getElementsByClassName("emoji-wysiwyg-editor form-control")[0].innerHTML = "hello";

Answer 5

使用JS，

var a = document.querySelector('.emoji-wysiwyg-editor');
a.innerHTML = "Hello";