首页   注册   登录
V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
Coding
V2EX  ›  程序员

吐槽:jquery 真是给了一些人乱搞的机会~

  •  
  •   xiaomajia008 · 2014-05-12 15:36:54 +08:00 · 5761 次点击
    这是一个创建于 2040 天前的主题,其中的信息可能已经有所发展或是发生改变。
    满篇的$,什么都$,id class element 就这样搞,一点都不考虑以后万一换标签换样式了怎么办?

    校验,全是 append("<span>错误信息</span>"),懒得想也起码在页面上配置一下阿,以后改文字错误信息还找你?错误信息的样式以后怎么定制?

    整个文件看下来乱糟糟一点规划都没有。。。

    更牛的是明明用不到的js也乱引,还好jquery 容错不报错。。。

    我还是建议初涉前端的开发人员慎用。。方便的同时 会让你丢很多东西。
    第 1 条附言  ·  2014-05-13 14:44:02 +08:00
    哎,我从来没说反对用jquery,为啥你们都认为我在吐槽jquery呢?

    难道我的意思不是因为它便利,所以有人胡乱写?

    虽然那样没错。但是给后人维护带来了不便。
    47 回复  |  直到 2014-05-13 15:01:36 +08:00
        1
    flynngao   2014-05-12 15:50:24 +08:00
    lz是菜鸟?
        2
    qazwsxedc121   2014-05-12 16:06:15 +08:00
    整个js都是这样吧,脑子里有数的人自然会写出靠谱的代码来,想瞎搞的人你给他再严的框架他也能瞎写
        3
    loading   2014-05-12 16:09:55 +08:00 via Android
    您是说我用getElementbyId就不能瞎搞了?

    您是在大公司上班吧,欢迎到我们民间来视察!
        4
    loading   2014-05-12 16:10:46 +08:00 via Android
    #反正以后重(bu)构(guan)
        5
    66beta   2014-05-12 16:12:22 +08:00
    初涉的应该用吧,学习上手快高级了就写原生了
        6
    jsonline   2014-05-12 16:14:01 +08:00   ♥ 11
    jQuery: 怪我咯?
        7
    ddyy   2014-05-12 16:15:52 +08:00
    jquery就是用来写一些外围的东西的,你还打算用它担大梁?
        8
    zakokun   2014-05-12 16:17:47 +08:00
    怪jQuery!?
        9
    akfish   2014-05-12 16:18:49 +08:00
    错的不是菜刀,而是用菜刀的人。
        10
    Ricky123   2014-05-12 16:20:50 +08:00
    都不知道槽点在哪里。。
        11
    learnshare   2014-05-12 16:22:09 +08:00
    jQuery 的定位可能不是这个,但它可以这么用。
        12
    jsonline   2014-05-12 16:24:19 +08:00   ♥ 2
    50%以上的JS都是门外汉写的。——鲁迅
        13
    hinobou   2014-05-12 16:26:45 +08:00
    感觉jQuery躺枪了
        14
    zythum   2014-05-12 16:27:52 +08:00
    jQuery: 怪我咯?
        15
    hkongm   2014-05-12 16:31:12 +08:00
    工具是死的,人是活的
        16
    sanddudu   2014-05-12 16:38:24 +08:00   ♥ 1
    @jsonline
    写 JS 的人中,60% 在使用 jQuery,但是之中 50% 的人都是门外汉。 ——白岩松
        17
    xiaomajia008   2014-05-12 16:40:32 +08:00
    我可能没描述好,我是觉得一些代码能组织一下就组织一下。

    第一行 $('#a').xxxx
    第三行 $('#a').xxxx

    连续几行这样的。

    难道就不能先 var a = $('#a');
    然后下面再 a.xxxx?

    再者

    <div id="boxA">
    <p class="abc"></p>
    <p class="abc"></p>
    <p class="abc"></p>

    </div>

    类似这种的
    $('.abc') 满篇都是的,
    没说不可以用,确实能实现效果
    但是多了以后性能问题怎么办呢?

    那么$('#boxA .abc') 这样会不会好点?维护人员也知道是哪里的问题


    练习可以随便搞,公司产品上线的东西可不能随心所欲了。
        18
    soundbbg   2014-05-12 16:41:58 +08:00
    和jquery没有关系,开发本身不太给力。
        19
    Mac   2014-05-12 17:40:08 +08:00
    LZ你该怪的是HTML标准,尼妹的哪来这么多ID SPAN DIV标签,直接用一图片格式解析不就得了嘛。。。。
        20
    chrisyipw   2014-05-12 18:03:58 +08:00
    @xiaomajia008 这明显和 jQuery 无关,是开发者的水平问题,不过 jQuery 过于易用、易上手的特性确实导致开发者水平走极端了。
        21
    zzNucker   2014-05-12 18:31:25 +08:00
    叫你们小码农去看下jQuery最佳实践就行了。
        22
    zhouquanbest   2014-05-12 19:08:13 +08:00
    jQuery:怪我啰
        23
    xcc7624   2014-05-12 19:22:59 +08:00 via Android
    感觉现在的工具易用性比以前好了许多,随便学几个月就自称程序员,实际上是个码农,其实像我这种菜鸟程序员就应该转行!
        24
    xcc7624   2014-05-12 19:23:43 +08:00 via Android
    感觉现在的工具易用性比以前好了许多,随便学几个月就自称程序员,实际上是个码农,其实像我这种菜鸟码农就应该转行!
        25
    muzuiget   2014-05-12 19:30:40 +08:00
    和 JQuery 没关系,开发者水平问题,用原生接口也会这个德性。
        26
    i8d0g   2014-05-12 21:17:39 +08:00
    同属于乱搞界的 楼主不妨给点干货 怎么写jquery才高端 才不是乱搞
        27
    mtmzorro   2014-05-12 23:19:05 +08:00
    同LS 有人提到的,开发人员不力不要怪语言、框架。。

    就jQuery而言,推荐 写这代码的人去 看看 http://www.ruanyifeng.com/blog/2011/08/jquery_best_practices.html jQuery 最佳实践。
        28
    soulteary   2014-05-13 00:57:30 +08:00
    @xiaomajia008 不满足现状可以让你变的更好,但是只是抱怨却不思考现有方案的益处不利于成长。似乎上面这句话说的太空,那么留三道题给楼主,如你所说:


    ````
    第一行 $('#a').xxxx
    第三行 $('#a').xxxx

    连续几行这样的。

    难道就不能先 var a = $('#a');
    然后下面再 a.xxxx?
    ````


    **Q1:是否有场景下,使用JQ必须重新获取元素。**


    ````
    满篇的$,什么都$,id class element 就这样搞,一点都不考虑以后万一换标签换样式了怎么办?
    ````

    **Q2:且不论这句话语句是否通顺,如果要进行大规模迭代,什么样子的方式可以较为合理的组织代码。**


    ````
    校验,全是 append("<span>错误信息</span>"),懒得想也起码在页面上配置一下阿,以后改文字错误信息还找你?错误信息的样式以后怎么定制?
    ````

    **Q3:这种情况如果该如何回归组件&模块化设计,所谓配置,应该包含哪些要素。**


    三人行必有我师,或许直面所有的问题,逐个解决会让你变的更好。
        29
    chshouyu   2014-05-13 01:12:41 +08:00   ♥ 2
    “菜刀真是给了一些人砍人的机会~”
        30
    sneezry   2014-05-13 01:16:43 +08:00
    @soulteary 又看到认为v2支持md的小伙伴了,喜闻乐见,哈哈
        31
    bakac   2014-05-13 07:01:33 +08:00
    不靠谱的人写不靠谱的代码, 看来楼主也属于不靠谱的人
        32
    xiaomajia008   2014-05-13 09:26:39 +08:00
    @soulteary

    感谢回复,我也只是就自己看到的问题吐槽而已,因为jquery提供了很方便的东西,所以造成很多人开发的时候不会思考问题。

    Q1:
    当然,有些条件下是需要重新获取元素。

    我这里说的是指这样的:

    <div id="abc"></div>

    $('#abc').bind('click',function(){
    $('#abc').html('')
    $('#abc').xxx
    $('#abc').xxx
    $('#abc').xxx
    })

    还有这样的

    for(var i = 0, i < xxx ; i ++){
    $('#abc').xxxx
    }

    这是让我吐槽的地方,当然如果写原生的也会试这样,跟开发人员水平有关。

    那么我之所以说 jquery 给一些开发人员乱搞的机会,那么看Q2

    Q2:
    满篇都是$.
    再举我上面的例子
    div#abc

    p.pic
    p.pic
    p.pic

    直接上来就是$('.pic'),试问,这样真的保险?
    如果是原生js,会让人那么容易取到?谁能保证其它开发人员不会改class 不会增加 相同的class?
    所以我说,如果要用那么也最好 $('#abc .pic'),这样最起码后面改代码的人知道你获取的是哪些节点。这样你大规模的换代码以这个区域就会失效,否则一直$('.xxx')难免会出错。

    我自己观点还是以id会钩子比较好。

    Q3:

    不说一些模块化配置这么高深的。因为方便,我看到很多人直接

    $('xxxx').append('<div>......</div>')

    append进一大堆东西进去。

    一个最简单的问题,当要换append里面的模板会不会造成要大量改js的时候?
    可以写一些简单的封装函数,可惜我这里情况并没有。。

    有些公司 html js 是分开的。。如果每次更新模板都要找相关的js人员,岂不是太痛苦?

    还是那点,如果是原生js。不会这么方便的 append,最起码你会一个个create,看到大量代码或许你会想到封装起来。

    当然,你也可能偷懒,直接 innerHTML('xxxx')

    但是,又有问题来了。你如果在有事件不会空得元素后面直接innerHTML 会导致事件失效。。这是不是又是一个可以触发开发人员想办法解决的点?

    所以我才会有以上吐槽。
        33
    tobyzw   2014-05-13 09:42:55 +08:00
    LZ吐槽的是“编码规范“
        34
    tititake   2014-05-13 10:17:25 +08:00
    难道不应该是
    $('#a').xxx1()
    .xxx2()
    .xxx3();
        35
    belin520   2014-05-13 11:25:47 +08:00
    jQuery:怪我咯?
        36
    miniwade514   2014-05-13 11:55:48 +08:00 via Android
    @xiaomajia008
    17楼,追求性能就不要写 $('#boxA .abc') 这种东西,想表明嵌套关系可以用注释
        37
    xiaomajia008   2014-05-13 12:34:12 +08:00
    @miniwade514 我只是举个例子说实在想$ class 还不如 那样
        38
    t2doo   2014-05-13 12:49:50 +08:00
    混口饭吃,能用就行,这么讲究干嘛
        39
    soulteary   2014-05-13 13:09:56 +08:00   ♥ 1
    @xiaomajia008 还是之前的那句回复,额外的不需要多说。

    @tititake 将this链式转送这个是个不错的语法糖,不过可惜po主举例没有提到。(扯远了

    Q1同样存在极限状况,当触发事件不唯一时,click的fn不能保证元素是否还是缓存中的this||e.target,

    Q2简洁、高效、易于维护,一直以来是以奇怪的关系维持在一起的,有时相生,有时此消彼长,原始作者的意图在一次次的迭代后可能不会太清晰,作为维护者唯一的职责就是尽可能的延续他正确的风格,修缮他不正确的地方。

    Q3如果你们公司是如此,那么不妨使用前端渲染的方式逐步迭代掉叫你痛苦的部分,而且如你所愿,定义在统一的模版文件中,或者页面打印config,改动量也不会特别大吧,那么修改掉就好,何必吐槽呢。

    私以为知行合一才是我们这些维护者该做的。

    几年前看到和自己风格迥异的代码,我也会不淡定,不过现在会细心观察别人代码架构和细节的可取之处,他山之石可以攻玉,勉之。
        40
    superbear   2014-05-13 13:36:50 +08:00
    Jquery是用来吸引新手的,展现javascript的魅力
        41
    Seita   2014-05-13 13:41:52 +08:00
    我经常

    第一行 $('#a').xxxx
    第三行 $('#a').xxxx

    连续几行这样的。
        42
    nickelchen   2014-05-13 13:52:47 +08:00
    jQuery多省事
    当你要一个个createElement 然后不断的appendChild时,多怀念
    $("<div><input type="text"><span></span>")
    这种东西。
    还有删除一个 node 的父节点时,原生的是要多啰嗦
    node.parentNode.parentNode.removeChild(node.parentNode)
    全部都应该使用jQuery,不要问为什么。
        43
    yolio2003   2014-05-13 14:10:57 +08:00
    壮哉,终于看出来我大jquery的气势啦,没事怪神马jQuery
        44
    towser   2014-05-13 14:20:44 +08:00
    不怪代码猴,怪行业分工不细致。后端代码猴兼写前端就是这个样子。这是社会主义发展的副产物。——孙海英
        45
    jarlyyn   2014-05-13 14:44:22 +08:00
    1.一般来说,是$('abc').xxx().xxx()这样吧?要么就是 $(xxx).each(function(){$(this).xxx})吧?感觉楼主的场景很少见啊。
    2.$(.xxx)我觉得没问题啊,这个就是类怎么定义的问题了。这玩意至少也要和css里对应的元素定义相匹配。
        46
    gouflv   2014-05-13 14:53:36 +08:00
    低端黑, 看不惯代码自己写呗, 吐槽有什么意义
        47
    fundon   2014-05-13 15:01:36 +08:00
    代码也不是都是一步到位的,吐嘈该吐嘈的,分享该分享的,且看且实践

    https://www.google.com.hk/search?q=jquery+best+practice
    关于   ·   FAQ   ·   API   ·   我们的愿景   ·   广告投放   ·   感谢   ·   实用小工具   ·   971 人在线   最高记录 5043   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.3 · 36ms · UTC 21:16 · PVG 05:16 · LAX 13:16 · JFK 16:16
    ♥ Do have faith in what you're doing.