Question

我已经编写了这段代码，它在我的div中插入了id =“editor”的图标。当我添加<select>时对于id="drug_tool"的div，用于样式的css规则将被忽略。我怎样摆脱这个问题？

这是我的代码

<div id="editor"></div>

<script>
    var ni = document.getElementById('editor');
    var newdiv = document.createElement('div');
    var divIdName = 'glavni';
    newdiv.setAttribute('id',divIdName);
    ni.appendChild(newdiv);

    var ni = document.getElementById('glavni');
    var newdiv = document.createElement('div');
    var divIdName = 'toolbar';
    newdiv.setAttribute('id',divIdName);
    ni.appendChild(newdiv);

    var ni = document.getElementById('toolbar');
    var newdiv = document.createElement('div');
    var divIdName = 'prvi_tool';
    newdiv.setAttribute('id',divIdName);
    newdiv.innerHTML = 
            '<img src="images_zadaca/cut.png" onclick="" style="cursor:pointer;">   \
            <img src="images_zadaca/copy.png" onclick="removeElement(\'bold\')" style="cursor:pointer;">  \
            <img src="images_zadaca/paste.png" onclick="removeElement(\'bold\')" style="cursor:pointer;">  \
            <img src="images_zadaca/redo.png" onclick="izmijeni(\'redo\')" style="cursor:pointer;">  \
            <img src="images_zadaca/undo.png" onclick="izmijeni(\'undo\')" style="cursor:pointer;"> \
            <img src="images_zadaca/bold.png" onclick="izmijeni(\'bold\')" style="cursor:pointer;"> \
            <img src="images_zadaca/italic.png" onclick="izmijeni(\'italic\')" style="cursor:pointer;"> \
            <img src="images_zadaca/underline.png" onclick="izmijeni(\'underline\')" style="cursor:pointer;"> \
            <img src="images_zadaca/align_center.png" onclick="izmijeni(\'justifyCenter\')" style="cursor:pointer;"> \
            <img src="images_zadaca/align_justify.png" onclick="izmijeni(\'justifyFull\')" style="cursor:pointer;"> \
            <img src="images_zadaca/align_left.png" onclick="izmijeni(\'justifyLeft\')" style="cursor:pointer;"> \
            <img src="images_zadaca/align_right.png" onclick="izmijeni(\'justifyRight\')" style="cursor:pointer;">';
    ni.appendChild(newdiv);

    var ni = document.getElementById('toolbar');
    var newdiv = document.createElement('div');
    var divIdName = 'drugi_tool';
    newdiv.setAttribute('id',divIdName);
    newdiv.innerHTML = 
            '  \
        <select id="select2" onchange="bojaFonta()"> \
            <option value="red">Red</option> \
            <option value="blue">Blue</option> \
            <option value="green">Green</option> \
            <option value="black">Black</option> \
            <option value="white">White</option> \
        </select>  \
            <img src="images_zadaca/copy.png" onclick="removeElement(\'bold\')" style="cursor:pointer;">  \
            <img src="images_zadaca/paste.png" onclick="removeElement(\'bold\')" style="cursor:pointer;">  \
            <img src="images_zadaca/redo.png" onclick="izmijeni(\'redo\')" style="cursor:pointer;">  \
            <img src="images_zadaca/undo.png" onclick="izmijeni(\'undo\')" style="cursor:pointer;"> \
            <img src="images_zadaca/bold.png" onclick="izmijeni(\'bold\')" style="cursor:pointer;"> \
            <img src="images_zadaca/italic.png" onclick="izmijeni(\'italic\')" style="cursor:pointer;"> \
            <img src="images_zadaca/underline.png" onclick="izmijeni(\'underline\')" style="cursor:pointer;"> \
            <img src="images_zadaca/align_center.png" onclick="izmijeni(\'justifyCenter\')" style="cursor:pointer;"> \
            <img src="images_zadaca/align_justify.png" onclick="izmijeni(\'justifyFull\')" style="cursor:pointer;"> \
            <img src="images_zadaca/align_left.png" onclick="izmijeni(\'justifyLeft\')" style="cursor:pointer;"> \
            <img src="images_zadaca/align_right.png" onclick="izmijeni(\'justifyRight\')" style="cursor:pointer;">';
    ni.appendChild(newdiv);


</script>

Answer 1

您可以应用于select的唯一两种款式是color和background-color。

MSDN has the details：

除背景颜色和颜色外，将忽略通过选项元素的样式对象应用的样式设置。此外，直接应用于各个选项的样式设置将覆盖应用于整个包含的select元素的样式设置。

当javascript插入元素时，css被忽略

1 个答案: