如何使类似jquery的功能起作用？答案

【问题标题】：How to make jquery like function to work?如何使类似jquery的功能起作用？
【发布时间】：2014-07-31 02:34:09
【问题描述】：

我无法弄清楚以下代码有什么问题。我正在尝试实现类似 jquery 的功能，但以下代码对我不起作用。我可以看到 console.log(dome) 打印了圆顶数组中的所有段落，但是当我调用这个数组时它没有显示任何结果。你能帮忙吗？

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Testing</title>
<script>
function uquery(domElement){

    console.log("In uquery function");      
    var uqObject={} // end object   

    uqObject.css=function(property, value){

        var dome = document.getElementsByTagName(domElement);

        console.log(dome);
        console.log(property, value);
        console.log(dome.length);               
        for(i=0; i<dome.length; i++ ){

            console.log("loop count"+i);

            if(property=="color")
            {               
                dome[i].style.color=value;              
            }

        }//end loop

    }

    return uqObject; 

}// end uquery

uquery("p").css("color", "red");
//var obj=uquery("p");  
//obj.css("color", "red");


</script>
</head>

<body>
    <p>Testing Jquery like style</p>

    <p>See if it works</p>

    <p>Third Paragraph</p>
</body>
</html>

【问题讨论】：

你想像 jQuery 一样，但你显然忘记了$.ready()，因为你的问题与尝试在此之外使用 jQuery 相同。
@PM77-1 他在定义之后直接调用它。
@Barmar - 是的。错过了。
@Barmar 那么，这意味着我的 javascript 在 DOM 加载之前被调用了吗？
完全正确。一旦到达脚本中的uquery("p").css("color", "red")，它就会被调用，它位于<body> 标记之前。如果将脚本放在正文的末尾而不是之前，它会起作用。

标签： javascript jquery coding-style syntax-error

【解决方案1】：

你需要在元素添加到dom后调用该函数，比如window.onload事件

window.onload = function () {
    uquery("p").css("color", "red");
}

演示：Fiddle

还可以查看bracket notation 以访问动态属性

dome[i].style[property] = value;

【讨论】：