Javascript document.createElement不工作

我正在使用jQuery库创建一个插件

在这里，我将String.prototype存储在一个变量中，然后使用这个变量扩展我的Sting对象。这很好用

// String Prototyping store in a variable
// Save bytes in the minified version of js
var StrProto = String.prototype;
String.prototype.toProperCase = function () {
  return this.replace(/\w\S*/g, function (txt) {
    return txt.charAt(0).toUpperCase() + txt.substr(1).toLowerCase();
  });
};
// working fine
alert("yogesh kumar".toProperCase());

function xyz(x){
  alert(x)
}
var abc = xyz;
// working fine
abc("yogesh kumar");

在下一个例子中，我创建m函数xyz，它存储在 abc变量，这也可以正常工作

// String Prototyping store in a variable
// Save bytes in the minified version of js
var StrProto = String.prototype;
String.prototype.toProperCase = function () {
  return this.replace(/\w\S*/g, function (txt) {
    return txt.charAt(0).toUpperCase() + txt.substr(1).toLowerCase();
  });
};
// working fine
alert("yogesh kumar".toProperCase());

function xyz(x){
  alert(x)
}
var abc = xyz;
// working fine
abc("yogesh kumar");

在最后一种情况下，我将document.createElement存储在一个变量中 标记并使用标记创建按钮。但这是行不通的

var tag=document.createElement;
$(document.createElement("button")).html("document.Element").appendTo("#myDiv");

// not working
$(tag("button")).html("tag").appendTo("#myDiv");

请检查JSFIDLE上的链接：

错误：

含铬

未捕获类型错误：非法调用 在Firefox中

错误：NS\u错误\u XPC\u错误\u转换\u JS:无法转换JavaScript 论点 为什么会出现这种错误

解决方案是什么？

jQuery可以为您提供以下简单的解决方案：

$("<button />").html("document.Element").appendTo("#myDiv");

要想知道您的方法不起作用的原因，请阅读下面的内容。

jQuery可以为您提供如下简单的解决方案：

$("<button />").html("document.Element").appendTo("#myDiv");

要了解方法不起作用的原因，请阅读下面的内容。

使用将本机JS方法分配给变量的方法：

var ce = document.createElement.bind(document);
var elem = ce('div');
alert(elem.nodeName);

适用于现代浏览器，包括IE9+。对于较旧的浏览器，请使用包装函数。

使用将本机JS方法分配给变量的方法：

var ce = document.createElement.bind(document);
var elem = ce('div');
alert(elem.nodeName);

适用于现代浏览器，包括IE9+。对于较旧的浏览器，请使用包装函数。

这是因为document.createElement在其内部使用包装函数。当您像document.createElement一样调用它时，它被设置为document。但是，当您将其保存为变量时，它就不再是文档，而是窗口

你需要根据上下文来调用它

var tag = document.createElement;  // you are saving the function, not its context
var btn = tag.call(document, 'button'); // you need to set the context

如果您的浏览器支持，也可以使用。绑定：

之所以会发生这种情况，是因为document.createElement在其内部使用了这种方法。当您像document.createElement一样调用它时，它被设置为document。但是，当您将其保存为变量时，它就不再是文档，而是窗口

你需要根据上下文来调用它

var tag = document.createElement;  // you are saving the function, not its context
var btn = tag.call(document, 'button'); // you need to set the context

如果您的浏览器支持，也可以使用。绑定：

---

此错误的原因是该方法丢失了上下文。必须在文档对象的上下文中调用方法createElement

在控制台中尝试以下操作：

var tag = document.createElement;
tag.call(document, "div");  // no error
tag("div");  // error

为什么必须在文档上下文中调用createElement的具体细节是特定于实现的，但很容易猜测

因此，要维护上下文，请为document.createElement创建函数包装器：

当然，jQuery还将为您创建元素：

$("<div>");  // new div element

---

此错误的原因是该方法丢失了上下文。必须在文档对象的上下文中调用方法createElement

在控制台中尝试以下操作：

var tag = document.createElement;
tag.call(document, "div");  // no error
tag("div");  // error

为什么必须在文档上下文中调用createElement的具体细节是特定于实现的，但很容易猜测

因此，要维护上下文，请为document.createElement创建函数包装器：

当然，jQuery还将为您创建元素：

$("<div>");  // new div element

---

您将获得对作为文档成员的函数的引用。当您直接调用该引用时，它的上下文现在是窗口而不是文档。下面是一个例子：

由于上下文丢失，bar调用没有生成console.log

显然，这只是一个简单的例子

更新：对于您正在使用的功能，我建议您执行以下操作：

$.createElement = function(tagName,attributes){
    return $(
        document.createElement(tagName),
        attributes ? attributes : {}
    )
}

---

现在您只需执行$.createElementbutton.htmltag.appendTomyDiv；它很快，而且仍然很容易阅读。请注意，IE在输入方面存在问题，如果您正在创建输入元素，我建议使用$，而不是使用此项。

您将获得对作为文档成员的函数的引用。当您直接调用该引用时，它的上下文现在是窗口而不是文档。下面是一个例子：

由于上下文丢失，bar调用没有生成console.log

显然，这只是一个简单的例子

更新：对于您正在使用的功能，我建议您执行以下操作：

$.createElement = function(tagName,attributes){
    return $(
        document.createElement(tagName),
        attributes ? attributes : {}
    )
}

---

现在您只需执行$.createElementbutton.htmltag.appendTomyDiv；它很快，而且仍然很容易阅读。请注意，IE在输入方面存在问题，如果您正在创建输入元素，我建议使用$，而不是使用此选项。

我猜这样调用会丢失上下文。例如，tag.calldocument按钮就可以工作@是的，你是对的。。。。我得到了答案。。。谢天谢地，我猜这样叫它会失去它的上下文。例如，tag.calldocument按钮就可以工作@是的，你是对的。。。。我得到了答案。。。谢谢我的问题是为什么我不能在javascript中存储document.createElementveriable@yoku2010但是，您可以这样做，因为它不再被作为文档的成员调用，所以它就是这样，或者上下文不再是文档。看这把小提琴：David的答案是包装document.createElement方法的更合适的方法。我的问题是为什么我不能在javascript中存储document.createElementveriable@yoku2010但是，您可以这样做，因为它不再被称为文档的成员，

---

就是这样，否则上下文就不再是文档了。看看这把小提琴：David的答案是包装document.createElement方法的更合适的方法。$document.createElement'div'比$and$快。请检查：$document.createElement'div'比$和$快。请检查：这是我问题的完美答案。。。谢谢Kevin B.你的例子很好。。。解释得很好。。。再次感谢你。。。我会处理IE问题。这是我问题的完美答案。。。谢谢Kevin B.你的例子很好。。。解释得很好。。。再次感谢你。。。我会处理IE的问题。