1

これを行うには多くの方法があるようですが、どれも意味がありません。タグを追加してその属性を編集する方法（document.writeの混乱なし）の例を誰かが私に与えることができれば、それはすべての一般的なブラウザで動作しますが、それは素晴らしいことです.
編集
IEで動作するかどうかは気にしません。もしそうなら、結構ですが、とにかく私はIEが嫌いなので、私が作成しているページの他のものはIEでは機能しないので、ブラウザを変更するように人々に依頼します.

4

5 に答える 5

3

<div>要素を作成してレイアウトに追加する最も簡単な例を次に示します。

var el = document.createElement("div");   // creating element
el.setAttribute("class", "myClass");      // setting attribute "class"
el.innerHTML = "Text";                    // adding text inside the element
document.body.appendChild(el);​            // appending new element to page body

デモ: http://jsfiddle.net/XVaqY/

IE で動作しないようにするには、ブラウザ チェックを追加します。そのようなもの：

function isIE() {
    return (navigator.appName == "Microsoft Internet Explorer");
}
于 2012-06-15T15:19:42.483 に答える
0

DOMにコンテンツを追加する方法は次のとおりです。

W3C推奨のアプローチを使用する：

var heading = document.createElement("h1");
heading.createTextNode("Foobar");
heading.className = "semantic-class-name-goes-here";
heading.setAttribute("aria-something-here", "bar");

innerHTMLの使用：

document
    .innerHTML("<h1 class='semantic-class-name-goes-here' aria-something-here='bar'>Foobar</h1>");

jQueryの使用：

var heading = $("h1")
    .addClass("semantic-class-name-goes-here")
    .attr("aria-something-here", "bar");

$(document).append(heading);
于 2012-06-15T15:27:26.097 に答える
0

これは、JavaScriptでDIVを追加する実際の例です

http://jsfiddle.net/wp2Re/

<html>  
<head>  
    <title>Javascript Create Div Element Dynamically</title>  
    <style type="text/css">  
        .dynamicDiv {  
            width: 200px;  
            height: 100px;  
            border: solid 1px #c0c0c0;  
            background-color: #e1e1e1;  
            font-size: 11px;  
            font-family: verdana;  
            color: #000;  
            padding: 5px;  
        }  
    </style>  

    <script type="text/javascript" language="javascript">  

        function createDiv() { 
            var divTag = document.createElement("div"); 

            divTag.id = "div1"; 

            divTag.setAttribute("align", "center"); 

            divTag.style.margin = "0px auto"; 

            divTag.className = "dynamicDiv"; 

            divTag.innerHTML = "This HTML Div tag created "  
                                + "using Javascript DOM dynamically."; 

            document.body.appendChild(divTag); 
        } 
    </script>  
</head>  
<body>  
    <p align="center">  
        <b>Click this button to create div element dynamically:</b>  
        <input id="btn1"   
                type="button"   
                value="create div"   
                onclick="createDiv();" />  
    </p>  
</body>  
</html>
于 2012-06-15T15:20:21.767 に答える
0

まず、 で要素を作成document.createElement()し、変数に保存します。この時点では、まだ DOM にはありません。次に、その属性を好きなだけ変更し、好きな時点で DOM に挿入します。私の例では、 of を持つ要素DIVをタグの最後に挿入します。idelementidbody

var newDiv = document.createElement("div");
newDiv.id = "elementid";
document.body.appendChild(newDiv);
于 2012-06-15T15:20:49.950 に答える
0

すべての IE バージョンを除外したい場合、webreflection ブログのこのトリックを使用して実行できます。

if (!(!+"\v1")) {
   var el = document.createElement("div");    
   ...
   document.body.appendChild(el);
}

あるいは、IE を検出するための別の条件として、

if (!top.execScript) { ... }

あるいは

var isIE = /*@cc_on!@*/!1;
if (isIE) { ... }

しかし、正直なところ、彼らは私にとってとてもハックです。
とにかく、IE を除外する技術的な理由を指定し、達成しようとしている機能の種類を教えていただければ、特定の IE 制限に基づいて、このタスクを実行するためのより安全な方法を提供できる可能性があります (機能の決定は、ブラウザ スニッフィング）。

于 2012-06-15T15:40:14.763 に答える