0

要素を別の要素に追加するのに苦労しています。私のアプローチはユニークです。基本的に、ユーザーはセレクターを入力するか、デフォルトではドキュメントです。

そのため、セレクターを指定するボタンと指定しないボタンの 2 つのボタンがあります。

<button onClick="callFunction({where:'#test'})"> Test selector</button>
<button onClick="callFunction()"> default</button>

そして関数「callFunction」：

function callFunction(arguments){
    scope= (arguments.where===undefined? $(document) : $(arguments.where));
    createElementIn(scope);
}

次に createElementIn(scope) 関数を呼び出し、指定されたセレクターに要素を作成します

function createElementIn(scope){
var newdiv = document.createElement('div');
       $(newdiv).css("position", "absolute");
       $(newdiv).css("left", "500px");
       $(newdiv).css("bottom", "500px");
       $(newdiv).css("display", "block");
       newdiv.innerHTML = str;
       scope.append(newdiv);//Over here, it does not append

}

$(scope) を実行するタイミングとスコープを終了するタイミングを混同しているように感じます... document.body.appendChild は機能しますが、document.body をスコープに渡すことができません。してください、これを解決する正しいアプローチは何ですか?

4

3 に答える 3

1

デフォルトのスコープはbody要素である必要があります-ドキュメントではなく、要素の絶対配置のために要素が表示されませんでした。

.css({...})ネイティブと jQuery を組み合わせて使用​​していましたが、jQuery ソリューションに更新しました -メソッドにスタイルを追加できます

function callFunction(params){
    var scope= ($.isPlainObject(params) && params.where) ? $(params.where) : $('body');
    createElementIn(scope);
}
function createElementIn(scope){
    var newdiv = $('<div />', {
        html: 'some content'
    }).css({
        //position: 'absolute',
        display: 'block',
    })
    scope.append(newdiv);
}

デモ:フィドル

于 2013-08-31T16:56:11.830 に答える
0

jQuery とネイティブの JavaScript を混在させています。誤解を避けるため、jQuery のみを使用してください。

たとえば、次のように書くことができます。

var $scope = (arguments.where===undefined? $(document) : $(arguments.where));
...
$scope.append(newdiv)

この場合、 $scope をこの $($scope) のように jQuery でラップする必要がないことがわかります。

于 2013-08-31T16:52:12.837 に答える
0

試す：

function createElementIn(scope){
    $('<div/>').css({
        position: "absolute",
        left: "500px",
        bottom: "500px",
        display: "block"
    }).appendTo(scope);
}
于 2013-08-31T16:51:14.273 に答える