2

我参与将 jquery 代码转换为 java 脚本以满足需求。

示例 1:

在 id 为“parent_elem”的父 html div 中有一些类名为“child_elems”的子元素。我需要动态更改子元素的宽度。jquery 代码将如下所示:

 $(#parent_elem).find(.child_elems).each(function(){
    $(this).css("width","50px");
 });

示例 javascript:

var parentelem = document.getElementById("parent_elem");

var childelems = parentelem.getElementsByClassName("child_elems");

for(var i=0;i<childelems.length;i++)
   childelems[i].style.width = "50px";

这可行,但我不确定这是否是一种有效的方法。

我们可以在不使用 for 循环的情况下完成相同的任务吗?javascript中是否有等价的.each, .next, ?.find

我对 javascript 和 jquery 也很陌生,如果有任何建议,我将不胜感激。

4

3 回答 3

3

您可以将以下内容用于您的工作,但请注意它们可能不适用于所有浏览器。如果可能,使用 jQuery 总是安全的。

// jQuery -> JavaScript
.each  -> array.forEach(callback[, thisArg])
.find  -> document.querySelector(selectors), document.querySelectorAll(selectors);
于 2013-07-01T12:00:12.723 回答
2

如果必须,您绝对可以这样做,jQuery 只是位于 javascript 之上的一个层。当您编写 jQuery 时,您正在编写 javascript。

如果您真的需要走这条路,查看 jQuery 源代码可能会有所帮助。James Padolsey 制作了一个非常有用的工具来检查 jQuery 提供的各种方法。您可以在此处查看该工具:http: //james.padolsey.com/jquery/#v=git&fn=jQuery.fn.next

请记住,jQuery 团队花了数年时间让他们的代码高效地工作并适用于多种浏览器。如果您的代码跨浏览器失败,请不要感到惊讶。

于 2013-07-01T11:56:17.477 回答
0

您可以在 github 上开始查看这些函数代码。.find = https://github.com/jquery/jquery/blob/master/src/traversing.js#L13 .each = https://github.com/jquery/jquery/blob/master/src/core.js #L541

于 2013-07-01T11:59:16.923 回答