APP推广合作
联系“鸟哥笔记小乔”
带你重新认识身边的前端工程狮
2021-01-24 12:08:00

今天要介绍的是产品经理的小伙伴之一:前端开发工程师,虽然天天和他们打交道,但是想必大家都没有好好的“关心”过他们,今天我们一起来看看天天接触的前端工程师到底在忙些什么。

现在移动互联网发展的这么快,前端开发领域也越来越广,前端早已经告别了切图崽的时代,在web端、移动端(安卓、IOS)、Watch、小程序、公众号开发、混合app开发都能看到前端开发工程师的影子

从狭义上讲,前端工程师使用 HTML、CSS、JavaScript 等专业技能和工具将产品UI设计稿实现成网站产品,涵盖用户PC端、移动端网页,处理视觉和交互问题

从广义上来讲,所有用户终端产品与视觉和交互有关的部分,都是前端工程师的专业领域

简单的说,前端开发工程师日常工作是创建Web页面或移动页面等前端界面呈现给用户的过程,通过前端三大件HTML、CSS、JavaScript以及衍生出来的各种技术、框架、解决方案,来实现互联网产品的用户界面交互 。

用户看到的每一个网页主要由三部分组成:结构( Structure) 、 表现( Presentation) 和行为( Behavior)。

HTML —— 结构, 决定网页的结构和内容(“是什么”);

CSS —— 表现( 样式) , 设定网页的表现样式(“什么样子”);

JavaScript —— 行为, 控制网页的行为(“做什么”);

HTML、CSS、JavaScript是前端开发中最基本也是最必须的三个技能。前端开发中,在页面的布局时, HTML将元素进行定义,CSS对展示的元素进行定位,再通过JavaScript实现相应的效果和交互。接下来我们好好聊聊这三大件,知己知彼。

HTML是什么?

可以把HTML结构想象成一个没穿衣服的人。

HTML指超文本标记语言(HyperText Markup Language),“超文本”就是指页面内可以包含图片、链接,甚至音乐、程序等非文字元素。前端开发利用HTML标签(Tag)来标记(Markup)网页中的文字。

(html代码示例)


上述代码是一个最基础HTML结构,一个网页的结构往往包括“头”和“主体”,头部的内容使用header标签标记,主要存放一些网页信息,例如网页标题、内容摘要、关键词等,头部内容也是SEO优化的重要对象。

主体部分用标签body标签标记,网页的内容全部放在body标签下,其内部又包含了很多代表不同含义的标签(如下表所示,只展示部分常用的)。

这些形形**的标签就构成了页面的内容,要注意的是整个网页的内容都要放在一个顶层标签html标签下。

标签

描述

定义锚。

定义粗体字。

定义文档的主体。

定义文档中的节。

定义定义列表。

to

定义 HTML 标题,可以改变标题的大小。

定义关于文档的信息。

定义 HTML 文档。

定义图像。

定义关于 HTML 文档的元信息。

定义段落。

定义文档中的节。

定义强调文本。

定义表格。

</span><span ></span></p></td><td width="536" colspan="1" rowspan="1" align="" valign="middle"><p ><span ></span></p><p ><span >定义文档的标题。</span><span ></span></p></td></tr><tr ><td width="179" colspan="1" rowspan="1" align="" valign="middle"><p ><span ></span></p><p ><span ><ul></span><span ></span></p></td><td width="536" colspan="1" rowspan="1" align="" valign="middle"><p ><span ></span></p><p ><span >定义无序列表。</span><span ></span></p></td></tr><tr ><td width="179" colspan="1" rowspan="1" align="" valign="middle"><p ><span ></span></p><p ><span ><video></span><span ></span></p></td><td width="536" colspan="1" rowspan="1" align="" valign="middle"><p ><span ></span></p><p ><span >定义视频。</span><span ></span></p></td></tr></tbody></table><p ><span >(常用标签)</span></p><p ><br /></p><p >例如:我们点击某个链接,然后自动跳转一个新的页面,这过程都是a标签在起作用。还有看到的图片,就是img标签承载图片的数据源。</p><p >最后,告诉大家两个查看HTML源码的方法,好奇的伙伴可以去试试。</p><p >(1)打开浏览器,鼠标在页面上右击,然后点击“查看页面源码”;</p><p >(2)打开浏览器,按 “F12” 键;</p><p ><img src="https://ngbjimg.xy599.com/16392205166049f64dafb942.40575410.png"></p><section ><br /></section><p ><span ><strong>CSS是什么?</strong></span><span ></span></p><p ><span >可以把CSS想象成给一个没穿衣服的人(HTML结构)化妆、穿衣服等,作用是让它变得美美的 。</span></p><p ><strong>CSS 指层叠样式表</strong>(Cascading Style Sheets),是一种将网页内容与网页样式分离的技术。我们经常会对一个网站评价道:这网站页面怎么这么乱;这网站看起来真大气,这背后都是受CSS影响;</p><p ><strong >css可以做什么</strong></p><p >(1) CSS主要用来设计网页的样式,美化网页;它不仅可以静态地修饰网页,还可以配合各种脚本语言动态地对网页各元素进行格式化。比如一开始文字显示是红色,我点击某个按钮后文字变黑色了。</p><p >(2) 你可以轻松地控制页面的布局,CSS 能够对网页中元素位置的排版进行像素级精确控制,因此我们能看到各式各样的布局风格。</p><p >(3) 在页面制作时采用CSS技术,可以有效地对页面的布局、字体、颜色、背景和其它效果实现更加精确的控制。例如通过文本属性,可以改变文本的颜色、字符间距,对齐文本,装饰文本,对文本进行缩进等等。</p><p >(4) 你可以将许多网页的风格格式同时更新,不用再一页一页地更新了。你可以将站点上所有的网页风格都使用一个CSS文件进行控制,只要修改这个CSS文件中相应的行,那么整个站点的所有页面都会随之发生变动。</p><p >(5) CSS在几乎所有的浏览器上都可以使用。</p><p ><img src="https://ngbjimg.xy599.com/10873441106049f64e6e33d6.71162926.png"></p><p ><span >(CSS代码示例)</span></p><section ><span ><br /></span></section><p ><span ><strong>JS是什么?</strong></span><span ></span></p><p ><span >JS能够让HTML结构这个人"<span >跳舞</span>"、"跑步"等动作,主要</span><span >目的是让"<span >人</span>"动起来</span><span >。</span></p><p >JS(JavaScript)是一种属于网络的高级脚本语言,已经被广泛用于Web应用开发,常用来为网页添加各式各样的动态功能,为用户提供更流畅美观的浏览效果。通常JavaScript脚本是通过嵌入在HTML中来实现自身的功能的。</p><p ><strong>js可以做什么</strong></p><p >(1) 使网页具有交互性,例如,banner轮播效果、手动Tab切换等效果;</p><p >(2) 可以处理表单,检验用户的输入,并提供及时反馈节省用户时间。例如,表单中要你输入电子邮箱而你却输入一个手机号,那么应该给你一个错误提醒。</p><p >(3) 还可以根据用户的操作,动态的创建页面。例如,发邮件时,添加附件操作。</p><p >(4) 设置cookie,cookie是存储在浏览器上的一些临时信息,例如你浏览过的网站地址,使用过的用户名。</p><p >(5) 跨平台特性,在绝大多数浏览器的支持下,可以在多种平台下运行(如Windows、Linux、Mac、Android、iOS等)。</p><p >(6) ......等等</p><p ><img src="https://ngbjimg.xy599.com/14715123706049f64f318116.98880407.png"></p><p ><span >(JS代码示例)</span></p><section ><br /></section><p >前端三大件到此介绍完毕,不过现在有些其他语言的程序猿在讨论HTML、CSS、JS倒是算不算编程语言。</p><p ><img src="https://ngbjimg.xy599.com/12792047166049f64fe69a20.50138905.png"></p><p ><span ><strong>全栈工程师</strong></span><span ></span></p><p >前端开发工程师在精进一步可以发展为全栈工程师,向<span >T</span><span >型人才或者π型人才发展。</span></p><p >全栈工程师熟悉多种开发语言,同时具备前端和后台开发能力,既能做前端(需要熟悉前端三大件以及Vue等各种前端技术),又能做后端(需要熟悉<span >Node.js</span>或Java或ASP.net或php或Go<span >等</span>),可以独自完成一个产品的前、后台开发工作。</p><p >简单了解下全栈工程师的技术栈有哪些:</p><p >(1) 前端技术:HTML/HTML5、CSS/CSS3、LESS/Javascript、jQuery、RequireJS、AngularJS、Vue等;</p><p >(2) 后端技术:node.js或Java、php等;</p><p >(3) 中间件:Nginx或Dubbo;</p><p >(4) 数据库:MySQL或MongoDB;</p><p >(5) 代码管理:git、svn;</p><p >(6) 构建工具:webpack、gulp、Jenkins;</p><p >(7) ......等等;</p><p >我们可以看到,对于全栈工程师来说,要活到老,学到老,其中最重要的属性,就是不同的思维方式和强大的学习能力。</p><p >最后,请重新认识一下你身边那个平平无奇的前端小伙伴吧!也可以把本篇文章分享给他看看,到底有几分像,哈哈。</p><p ><img src="https://ngbjimg.xy599.com/10414131460483fb96dcc10.09146632.jpeg"></p> </div> <div style="height: 1px"></div> </div> <!--作者信息--> <div class="article_author_box"> <div class="article_source"> <span>本文系作者:</span> <a class="article_author" href="/authorview/5818">道叁</a> <span>授权发表,鸟哥笔记平台仅提供信息存储空间服务。</span> <!-- <span>来源:产品大秘籍</span> --> </div> <!-- <p class="article_tip"></p> --> <p class="article_tip">本文为作者独立观点,不代表鸟哥笔记立场,未经允许不得转载。</p> <p class="article_tip" style="margin-left: -8px"> <a style="display: inline; color: #4C73AE;" href="https://www.niaogebiji.com/article-29046-1.html" target="_blank">《鸟哥笔记版权及免责申明》</a> 如对文章、图片、字体等版权有疑问,请点击 <a style="display: inline; color: #4C73AE" href="https://niaogebj.mikecrm.com/FVEhsoN" target="_blank">反馈举报</a> </p> </div> </div> <div style="clear: both"></div> <div class="articles_page clearfix"> <a href="/article-62020-1.html" class="articles_page_l"> <div class="articles_page_l_btn"> <img class="btn_icon" style="margin-right:5px;" src="/img/article/icon_pre.png" alt=""> <span class="btn_text">上一篇</span> </div> <div class="articles_page_l_text" >优惠券设计需要考虑的细节及边界问题</div> </a> <a href="/article-62018-1.html" class="articles_page_r"> <div class="articles_page_r_btn" > <span class="btn_text">下一篇</span> <img class="btn_icon" style="margin-left:5px;" src="/img/article/icon-next.png" alt=""> </div> <div class="articles_page_r_text" >产品经理需了解前端人员为什么使用组件/UI框架</div> </a> </div> <div style="background: #fff; position: relative; z-index: 1"> <div style="height: 5px"></div> <!-- 下载资料 样式在 newtest.css中 --> <!-- 投稿 --> <a href="https://www.niaogebiji.com/article-644427-1.html" target="_blank"> <img style="width: 766px; height: 160px; margin: 20px auto;" src="https://qnssl.niaogebiji.com/69298a2b8e21889e438195c663fe296f.png" alt=""> </a> <div class="shareToBox articleControlBoxWrap"> <div class="shareListBox articleControlBox is-fixed"> <div class="left"> <a href="/authorview/5818" class="header"> <img class="header_img" src="https://qnssl.niaogebiji.com/1298612005a13931497b989.17492013.png" alt=""> <img class="author_type_icon" src="/img/icon/author_icon_person2.png" alt=""> </a> <a href="/authorview/5818" class="user_name">道叁</a> <div class="btn follow_btn not_has_follow_btn" data-author="5818" data-value="0" data-uid="0">关注</div> <div style="display: none" class="btn follow_btn has_follow_btn" data-author="5818" data-value="0" data-uid="0">已关注</div> </div> <div class="right"> <div class="wecharticon articleControlBoxSmallIcon"> <div class="wecharticonQr shadow"> <img src="/qr.php?qr_url=https%3A%2F%2Fwww.niaogebiji.com%2Farticle-62019-1.html" alt=""> <span>分享到朋友圈</span> </div> </div> <a style="display:none" class="weboicon articleControlBoxSmallIcon" href="http://v.t.sina.com.cn/share/share.php?title=带你重新认识身边的前端工程狮-鸟哥笔记&url=https%3A%2F%2Fwww.niaogebiji.com%2Farticle-62019-1.html&source=bookmark" target="_blank"></a> <button onclick="myCopy()" class="ljicon articleControlBoxSmallIcon" data-aid="62019"> <div class="clickfzbw shadow">复制本文链接</div> </button> </div> <div class="middle"> <div class="action_item action_item1 cursor" data-id="62019" data-title="带你重新认识身边的前端工程狮"> <div class="collect_status1"> <img class="icon" src="/img/icon/collect_icon1.png" alt=""> <span>收藏</span> </div> <div class="collect_status2"> <img class="icon" src="/img/icon/collect_icon2.png" alt=""> <span style="color: #242629">收藏</span> </div> </div> <div class="action_item action_item2 cursor"> <div class="grade_status1"> <img class="icon" src="/img/icon/grade_icon1.png" alt=""> <span>评分</span> </div> <div style="display: none" class="grade_status2"> <img class="icon" src="/img/icon/grade_icon2.png" alt=""> <span style="color: #242629">评分</span> </div> </div> <!--<div class="action_item action_item3 cursor"> <div class="comment_status1"> <img class="icon" src="/img/icon/comment_icon1.png" alt=""> <span>评论</span> </div> <div style="display: none" class="comment_status2"> <img class="icon" src="/img/icon/comment_icon2.png" alt=""> <span style="color: #242629">评论</span> </div> </div>--> <div class="line1"></div> </div> </div> </div> <!-- <div class="breadcrumbBoxWrap"> <div class="breadcrumbBox"> <a class="colorLink" href="/">首页</a> ≫ <a class="colorLink" href="/cat/118"> 产品运营 </a> ≫ 带你重新认识身边的前端工程狮 </div> </div> --> <div class="break_line"></div> <!-- 评分模块 --> <div id="grade_module" class="grade_module"> <div class="top"> <p style="width: 300px; float: left;" class="commentNumber yellowafter2"> 综合评分: <span class="article_point" style="color: #FFB740"></span> </p> <div class="clearfix"></div> </div> <div class="score_start"> <span class="title" style="float: left">我的评分</span> <div id="xzw_starSys"> <div id="xzw_starBox"> <ul class="star" id="star"> <li><a href="javascript:void(0)" title="1" class="one-star">1</a></li> <li><a href="javascript:void(0)" title="2" class="two-stars">2</a></li> <li><a href="javascript:void(0)" title="3" class="three-stars">3</a></li> <li><a href="javascript:void(0)" title="4" class="four-stars">4</a></li> <li><a href="javascript:void(0)" title="5" class="five-stars">5</a></li> </ul> <div class="current-rating" id="showb"></div> </div> </div> <div class="clearfix"></div> </div> </div> <div class="break_line"></div> <!-- 测一测 样式在 newtest.css中 --> <!-- <div id="comment_anchor" class="commentList"> <div> <p style="width: 300px; float: left" class="commentNumber yellowafter2">参与评论()</p> <p class="showrulebtn" style="width: 140px; margin-top:30px; float: right; position: relative; color: #5C5C5C; cursor: pointer; font-size: 14px">社区交流公约 <img style="width: 15px; position: absolute; top: 2px; right: 36px" src="/img/icon/rule@2x.png" alt=""> </p> <div class="clearfix"></div> </div> <div class="first-level-review common"> <div class="noUser"> <img class="noUser_shafa" src="/img/icon/shafa.png" alt=""> <div class="noUser_text">暂无评论,快来抢沙发吧~</div> </div> <div class="noUserContent" style='margin-bottom: 0'> <textarea class="noUserContent_top" id="first-level-review" placeholder="看完本文有什么想问/想说/想补充的嘛?通过审核的优质留言,将额外获赠羽毛奖励^^" maxlength="500" name="" cols="30" rows="10"></textarea> <div class="noUserContent_bottom"> <div class="noUserContent_br noUserContent_br2 firstSubmitBtn">发布评论</div> </div> <div class="common_bottom_tips">鸟哥笔记用户社区<a href="/pc/index/convention" target="_blank">交流公约</a> </div> </div> </div> <div class="first-level-review common"> <div class="noUser"> <img class="noUser_shafa" src="/img/icon/shafa.png" alt=""> <div class="noUser_text">暂无评论,快来抢沙发吧~</div> </div> <div class="noUserContent"> <div class="noUserContent_bl"> <a onclick="loginInit();" style="cursor: pointer;">登录</a>后参与评论 </div> <textarea class="noUserContent_top" cols="30" rows="10"></textarea> <div class="noUserContent_bottom"> <div class="noUserContent_br noUserContent_br2">发布评论</div> </div> <div class="common_bottom_tips">鸟哥笔记用户社区<a href="/pc/index/convention" target="_blank">交流公约</a> </div> </div> <p></p> </div> <div class="commentAll"> <div class="commentItems"> <div class="firstItem item" data-cid=""> <div class="user_header_box"> <img class="icon" src="" alt=""> </div> <div class="commentRight"> <div class="name elp"> <img class="nameBq" src="/img/icon/author_icon.png" alt=""> </div> <div class="commmentBox"> <div style="white-space: pre-wrap; word-wrap: break-word;color: #666666;"></div> </div> <p style="color:#999999"> </p> </div> <div class="replyBox"> <textarea maxlength="500" type="text" class="replytext"></textarea> <p><a href="javascript:;" class="commentsubmit_btn secondSubmitBtn blueShade">发布</a></p> </div> <div class="secondCommentBox"> <div class="secondComment" > <div class="user_header_box2"> <img class="secondIcon" src="" alt=""> </div> <div class="secondCommentRight"> <p> <span style="font-size:16px;color:#333333;font-weight: 500;">作者</span><span style="font-size:12px;margin:0 5px;">回复</span><span style="font-size:16px;color:#333333;font-weight: 500;"></span> </p> <div class="secondCommmentBox"> <pre style="white-space: pre-wrap; word-wrap: break-word;"></pre> <p style="color: #999999;font-size:12px;margin-top:10px;"></p> </div> </div> </div> <div class="secondComment" data-cid=""> <div class="user_header_box2"> <img class="secondIcon" src="" alt=""> </div> <div class="secondCommentRight"> <p> </p> <div class="secondCommmentBox"> <pre style="white-space: pre-wrap; word-wrap: break-word;"></pre> <p> </p> </div> </div> </div> </div> </div> </div> </div> </div>--> <div class="featherselection"> <img class="featherselection_titleimg" src="https://qnssl.niaogebiji.com/4658463045d79fc5cf321d8.26214840.gif" alt=""> <div class="featherselection_box"> <div class="featherselection_list"> <div class="list_left"> <div class="list_left_title elp"> Xinstall 15天会员特权 </div> <div class="list_left_content"> Xinstall是专业的数据分析服务商,帮企业追踪渠道安装来源、裂变拉新统计、广告流量指导等,广泛应用于广告效果统计、APP地推与CPS/CPA归属统计等方面。 </div> <div class="list_left_coin"> 20羽毛</div> </div> <div class="list_right"> <img src="https://qnssl.niaogebiji.com/213809443061ea6d9dd30c27.80477250.png" alt=""> </div> <div class="featherselection_but">立即兑换</div> </div> <div class="featherselection_list"> <div class="list_left"> <div class="list_left_title elp"> 一书一课30天会员体验卡 </div> <div class="list_left_content"> 领30天VIP会员,110+门职场大课,250+本精读好书免费学!助你提升职场力! </div> <div class="list_left_coin"> 20羽毛</div> </div> <div class="list_right"> <img src="https://qnssl.niaogebiji.com/6821824215fe2c3254b7383.55915811.png" alt=""> </div> <div class="featherselection_but">立即兑换</div> </div> <div class="featherselection_list"> <div class="list_left"> <div class="list_left_title elp"> 顺丰同城急送全国通用20元优惠券 </div> <div class="list_left_content"> 顺丰同城急送是顺丰推出的平均1小时送全城的即时快送服务,专业安全,准时送达! </div> <div class="list_left_coin"> 30羽毛</div> </div> <div class="list_right"> <img src="https://qnssl.niaogebiji.com/16968207425fbb77194540a7.81646082.jpg" alt=""> </div> <div class="featherselection_but">立即兑换</div> </div> </div> </div> </div> </div> <div class="right contentRight" style="position:relative;"> <!--<a href="/pc/mims/index20" target="_blank"> <img class="download_app_module" style="width: 354px; height: 156px; border-radius: 8px; margin-bottom: 8px" src="/img/index/app_download_img6.png" alt=""> </a>--> <a href="https://www.niaogebiji.com/article-644427-1.html" target="_blank" onclick="adv_click(872);"> <img class="download_app_module" style="width: 354px; height: 156px; border-radius: 8px; margin-bottom: 8px" src="https://qnssl.niaogebiji.com/2961fb699ecf1a3310a437f74ae5d65e.png" alt=""> </a> <div class="rankingBox" style="margin-bottom: 16px"> <div class="articleDetailAuthorPromote"> <div style="position: relative;" class="promoteAuthorItemRow1"> <div class="author_info"> <a class="author_img" href="/authorview/5818"> <img src="https://qnssl.niaogebiji.com/1298612005a13931497b989.17492013.png" alt="道叁" class="promoteAuthorItemRow1Left"> </a> <!-- <button style="position: absolute; top: 70px; width: 72px;" class="promoteAuthorFocusBtn newColorBtn not_has_follow_btn" data-author="5818" data-value="0" data-uid="0">关注</button> --> <button style="position: absolute; top: 70px; width: 72px; display: none" class="promoteAuthorFocusBtn newColorBtn hasFollow has_follow_btn" data-author="5818" data-value="0" data-uid="0">已关注</button> <div class="promoteAuthorItemRow1Right"> <a target="_blank" href="/authorview/5818" class="promoteAuthorName colorLink"> 道叁 </a> <div class="author_item_tip">发表文章<span>23</span>篇</div> <img class="promoteAuthorNameBq" src="/img/icon/author_icon_person2.png" alt=""> </div> </div> <div class="promoteAuthorSummary" data-aid="62019"> 产品大秘籍 </div> </div> </div> </div> <div class="recommRead"> <div class="recommReadTitle yellowafter" > <span>作者最近文章</span> <a class="lookMore" href="/authorview/5818">查看更多</a> </div> <div class="readList"> <a href="/article-634786-1.html" class="readList-item"> <div class="readList-item-r"> <div class="readList-title">解析:如何设计电商系统库存分层</div> <div class="readList-tips"> <span class="readList-author">产品运营</span> <span class="readList-date">2023-09-18</span> </div> </div> </a> <a href="/article-483094-1.html" class="readList-item"> <div class="readList-item-r"> <div class="readList-title">如何将WBS任务分解法运用到工作/学习/生活中</div> <div class="readList-tips"> <span class="readList-author">效率工具</span> <span class="readList-date">2022-11-09</span> </div> </div> </a> <a href="/article-482236-1.html" class="readList-item"> <div class="readList-item-r"> <div class="readList-title">MES系统:质量管理规划该怎么做?</div> <div class="readList-tips"> <span class="readList-author">职场认知</span> <span class="readList-date">2022-10-26</span> </div> </div> </a> </div> </div> <div class="recommRead"> <div class="recommReadTitle yellowafter" > <span>热门文章</span> </div> <div class="readList"> <a href="https://www.niaogebiji.com/article-477716-1.html" class="readList-item"> <img class="readList-item-l" src="https://qnssl.niaogebiji.com/50b6da85112e21710d78b44f2cc8a8a3.png" alt=""> <div class="readList-item-r" style="width: 197px;"> <div class="readList-title">做私域,怎么快速扩展“流量池”</div> <div class="readList-tips"> <span class="readList-author">智旗战略咨询</span> <span class="readList-date">2022-10-18</span> </div> </div> </a> <a href="https://www.niaogebiji.com/article-69705-1.html" class="readList-item"> <img class="readList-item-l" src="https://qnssl.niaogebiji.com/5443339176065904c129646.87217300.jpeg" alt=""> <div class="readList-item-r" style="width: 197px;"> <div class="readList-title">广告质量度 “输”不起?3个妙招“赢”回来</div> <div class="readList-tips"> <span class="readList-author">九枝兰</span> <span class="readList-date">2021-04-01</span> </div> </div> </a> <a href="https://www.niaogebiji.com/article-88048-1.html" class="readList-item"> <img class="readList-item-l" src="https://qnssl.niaogebiji.com/134848669161d766f9037131.98266989.jpeg" alt=""> <div class="readList-item-r" style="width: 197px;"> <div class="readList-title">混合/灵活办公模式将持续存在</div> <div class="readList-tips"> <span class="readList-author">安妮HR百宝箱</span> <span class="readList-date">2022-01-07</span> </div> </div> </a> <a href="https://www.niaogebiji.com/article-149643-1.html" class="readList-item"> <img class="readList-item-l" src="https://qnssl.niaogebiji.com/3ab4f310ba8fcf2f71c7396572d704a2.png" alt=""> <div class="readList-item-r" style="width: 197px;"> <div class="readList-title">买9本书全是盗版!当当网摊上事了</div> <div class="readList-tips"> <span class="readList-author">品牌头版</span> <span class="readList-date">2022-07-19</span> </div> </div> </a> <a href="https://www.niaogebiji.com/article-59297-1.html" class="readList-item"> <img class="readList-item-l" src="https://qnssl.niaogebiji.com/catlist_default_pic.png" alt=""> <div class="readList-item-r" style="width: 197px;"> <div class="readList-title">从小白到金牌优化师,你需要做好这3点(文末抽奖)</div> <div class="readList-tips"> <span class="readList-author">九枝兰</span> <span class="readList-date">2021-02-05</span> </div> </div> </a> <a href="https://www.niaogebiji.com/article-25772-1.html" class="readList-item"> <img class="readList-item-l" src="https://qnssl.niaogebiji.com/15647346685e671940cc0020.56704797.jpeg" alt=""> <div class="readList-item-r" style="width: 197px;"> <div class="readList-title">“昨天数据怎么跌了30%?”4个技巧轻松应对老板发问</div> <div class="readList-tips"> <span class="readList-author">行走的大雄</span> <span class="readList-date">2020-03-10</span> </div> </div> </a> <a href="https://www.niaogebiji.com/article-50377-1.html" class="readList-item"> <img class="readList-item-l" src="https://qnssl.niaogebiji.com/catlist_default_pic.png" alt=""> <div class="readList-item-r" style="width: 197px;"> <div class="readList-title">李志刚:2020年,养老产业的黄金时期将加速到来</div> <div class="readList-tips"> <span class="readList-author">新经济100人</span> <span class="readList-date">2020-07-14</span> </div> </div> </a> <a href="https://www.niaogebiji.com/article-62035-1.html" class="readList-item"> <img class="readList-item-l" src="https://qnssl.niaogebiji.com/catlist_default_pic.png" alt=""> <div class="readList-item-r" style="width: 197px;"> <div class="readList-title">为什么你工作了很久,还是感觉没什么提升?</div> <div class="readList-tips"> <span class="readList-author">王家郴</span> <span class="readList-date">2020-12-27</span> </div> </div> </a> <a href="https://www.niaogebiji.com/article-66254-1.html" class="readList-item"> <img class="readList-item-l" src="https://qnssl.niaogebiji.com/catlist_default_pic.png" alt=""> <div class="readList-item-r" style="width: 197px;"> <div class="readList-title">手机键盘中隐藏的交互细节</div> <div class="readList-tips"> <span class="readList-author">Clippp</span> <span class="readList-date">2020-04-24</span> </div> </div> </a> <a href="https://www.niaogebiji.com/article-646399-1.html" class="readList-item"> <img class="readList-item-l" src="https://qnssl.niaogebiji.com/1794978078655bc0fdd78451.81562817.jpeg" alt=""> <div class="readList-item-r" style="width: 197px;"> <div class="readList-title">人宠关系升级,食品饮料品牌如何“伺宠而娇”?</div> <div class="readList-tips"> <span class="readList-author">FDL数食主张</span> <span class="readList-date">2023-11-21</span> </div> </div> </a> </div> </div> <!--<div class="hotCompany right-layout" > <div class="hotCompanyTop"> <div class="hotCompanyTopTitle">热门服务商推荐</div> <a href="/pc/resource/esall" target="_blank" class="hotCompanyTopMore">查看更多</a> </div> <div class="hotCompanyListAll clearfix"> <div class="hotCompanyList "> <a href="/esdetail/" class="hotCompanyItem"> <div class="hotCompanyItemT"> <img src="" alt=""> <div > <div class="hotCompanyItemTitle"></div> <div class="hotCompanyItemSummy"></div> </div> </div> <div class="hotCompanyItemB"> <div style="display:flex"> <div class="hotCompanyItemPosition"></div> <div class="hotCompanyItemCate"></div> </div> <div class="score"> <div class="scoreIcon "></div> <div class="scoreIcon "></div> <div class="scoreIcon "></div> <div class="scoreIcon "></div> <div class="scoreIcon "></div> <div class="scoreNum"></div> </div> </div> </a> </div> <div class="hotCompanyList "> <a href="/esdetail/" class="hotCompanyItem"> <div class="hotCompanyItemT"> <img src="" alt=""> <div > <div class="hotCompanyItemTitle"></div> <div class="hotCompanyItemSummy"></div> </div> </div> <div class="hotCompanyItemB"> <div style="display:flex"> <div class="hotCompanyItemPosition"></div> <div class="hotCompanyItemCate"></div> </div> <div class="score"> <div class="scoreIcon "></div> <div class="scoreIcon "></div> <div class="scoreIcon "></div> <div class="scoreIcon "></div> <div class="scoreIcon "></div> <div class="scoreNum"></div> </div> </div> </a> </div> </div> <div class="hotCompanyPage"> <div class="pageNum"> <div class="pageNum-item activeNum" ></div> <div class="pageNum-item" ></div> </div> </div> </div>--> <div class="hotFindBox" > <div class="hotFindTitle yellowafter" > <span class="hotFind ">热门标签</span> <a class="lookMore" href="/pc/index/tag">查看更多</a> </div> <div class="hotFindList clearfix"> <a href="/tag/视频直播" target="_blank" class="hotList left">视频直播</a> <a href="/tag/周边产品" target="_blank" class="hotList left">周边产品</a> <a href="/tag/选题" target="_blank" class="hotList left">选题</a> <a href="/tag/治愈" target="_blank" class="hotList left">治愈</a> <a href="/tag/设计网站" target="_blank" class="hotList left">设计网站</a> <a href="/tag/直播" target="_blank" class="hotList left">直播</a> <a href="/tag/Excel" target="_blank" class="hotList left">Excel</a> <a href="/tag/理财" target="_blank" class="hotList left">理财</a> <a href="/tag/人力资源" target="_blank" class="hotList left">人力资源</a> <a href="/tag/双十二" target="_blank" class="hotList left">双十二</a> </div> </div> <div class="new-question"> <div class="recommReadTitle yellowafter" > <span>推荐回答</span> <a class="lookMore" href="/qa">查看更多</a> </div> <div class="question-list"> <a href="/question/3" class="question-list-item text2"> <span class="question-list-item-dot"></span> <span class="list-item-text text2">产品运营、用户运营、内容运营到底有哪些区别?</span> </a> <a href="/question/260" class="question-list-item text2"> <span class="question-list-item-dot"></span> <span class="list-item-text text2">电商代运营靠谱吗?代运营为什么不自己卖商品?</span> </a> <a href="/question/329" class="question-list-item text2"> <span class="question-list-item-dot"></span> <span class="list-item-text text2">新媒体为什么新?新媒体新在哪里了呢?</span> </a> <a href="/question/452" class="question-list-item text2"> <span class="question-list-item-dot"></span> <span class="list-item-text text2">小红书笔记发布时间有什么讲究吗?</span> </a> <a href="/question/456" class="question-list-item text2"> <span class="question-list-item-dot"></span> <span class="list-item-text text2">请问运营知识该从何学起?</span> </a> </div> </div> <!-- 右侧渠道推荐 --> <div class="alertsBox cooperationBox" style="height: 100%;border-radius:6px;"> <div class="qudaoContent"> <div class="qudaoTitle"> <a href="/zchnlist" class="getMore"> <div class="titleName">渠道推荐</div> <div class="titleMore">查看更多</div> </a> </div> </div> </div> <!-- 右侧合作推荐 --> <div class="alertsBox cooperationBox" style="height: 100%;border-radius:6px;"> <div class="hezuoContent"> <div class="qudaoTitle hezuoTitle"> <a href="/cooplist" class="getMore"> <div class="titleName">合作推荐</div> <div class="titleMore">查看更多</div> </a> </div> <div class="hezuoItemInfos"> <a href="/coopdetail/14389" class="hezuoItemInfo"> <div class="hezuoItem" style="background:#fff"> <img src="https://qnssl.niaogebiji.com/834149015606e67341e3685.34083082.jpeg" alt="" class="hezuoLeftImg"/> <div class="hezuoText"> <div class="hezuoTextTitle">品牌新媒体推广资源供应</div> <div class="hezuoBottom"> <span class="hezuoKey">电商</span> <span class="hezuoKey">全国</span> </div> </div> </div> </a> <a href="/coopdetail/14361" class="hezuoItemInfo"> <div class="hezuoItem" style="background:#fff"> <img src="https://qnssl.niaogebiji.com/15971138005f7fe88de67299.86468721.jpeg" alt="" class="hezuoLeftImg"/> <div class="hezuoText"> <div class="hezuoTextTitle">办公工具类产品,会员互换/联合会员</div> <div class="hezuoBottom"> <span class="hezuoKey">商务</span> <span class="hezuoKey">全国</span> </div> </div> </div> </a> </div> </div> </div> <div class="gzh-box alertsBox" style="height: 178px;"> <img src="/img/gzh-ewm.jpg" alt=""> <a href="https://www.niaogebiji.com/article-644427-1.html" target="_blank" class="linkadv"> <img src="https://qnssl.niaogebiji.com/96aab645fde44e88ceb16e72290ffe62.png" alt=""> </a> </div> </div> </div> </div> <div class="fixedmc"> <div class="container clearfix" style="width:100%;height:100%"> <div class="left contentLeft" style="background:transparent;width:100%;height:100%;"> <img class="knowtop" src="/img/icon/knowtop.png" alt=""> <div class="knowleftbox"> <img class="knowleft" src="/img/icon/knowleft2.png" alt=""> </div> <div class="knowrightbox"> <img class="knowright" src="/img/icon/knowright2.png" alt=""> </div> </div> </div> </div> <div class="fixedtc qrxz"> <div class="downloadzl_box"> <div class="downloadzl_reason">确认要消耗 羽毛购买 <br/> 带你重新认识身边的前端工程狮吗?</div> <div class="downloadzl_left downloadzl_klyx">考虑一下</div> <div class="downloadzl_right downloadzl_ljxz" data-aid="62019"><a href="" target="_blank">立即下载</a></div> </div> </div> <div class="fixedtc ymbz"> <div class="downloadzl_box"> <div class="downloadzl_reason">很遗憾,羽毛不足</div> <div class="downloadzl_left downloadzl_klyx" style="margin-top:45px">我知道了</div> <div class="downloadzl_right downloadzl_qzym" style="margin-top:45px"><a class="buttonLink" href="/pc/center/mall">去赚羽毛</a></div> </div> </div> <div class="fixedtc commentRule"> <div style="width: 450px; height: 570px; top: 150px" class="downloadzl_box"> <div style="width: 100%; height: 75px; padding-top: 23px; background: url('/img/comments/rulemodal1@2x.png'); background-size: 100%"> <img style="width: 217px; margin: 0 auto" src="/img/comments/rulemodal2@2x.png" alt=""> </div> <div style="width: 370px; height: 380px; margin: 25px auto; font-size: 14px; color: #333;overflow-y:scroll"> <p>我们致力于提供一个高质量内容的交流平台。为落实国家互联网信息办公室“依法管网、依法办网、依法上网”的要求,为完善跟帖评论自律管理,为了保护用户创造的内容、维护开放、真实、专业的平台氛围,我们团队将依据本公约中的条款对注册用户和发布在本平台的内容进行管理。平台鼓励用户创作、发布优质内容,同时也将采取必要措施管理违法、侵权或有其他不良影响的网络信息。</p> <p><br />一、根据《网络信息内容生态治理规定》《中华人民共和国未成年人保护法》等法律法规,对以下违法、不良信息或存在危害的行为进行处理。<br />1. 违反法律法规的信息,主要表现为:<br />    1)反对宪法所确定的基本原则;<br />    2)危害国家安全,泄露国家秘密,颠覆国家政权,破坏国家统一,损害国家荣誉和利益;<br />    3)侮辱、滥用英烈形象,歪曲、丑化、亵渎、否定英雄烈士事迹和精神,以侮辱、诽谤或者其他方式侵害英雄烈士的姓名、肖像、名誉、荣誉;<br />    4)宣扬恐怖主义、极端主义或者煽动实施恐怖活动、极端主义活动;<br />    5)煽动民族仇恨、民族歧视,破坏民族团结;<br />    6)破坏国家宗教政策,宣扬邪教和封建迷信;<br />    7)散布谣言,扰乱社会秩序,破坏社会稳定;<br />    8)宣扬淫秽、色情、赌博、暴力、凶杀、恐怖或者教唆犯罪;<br />    9)煽动非法集会、结社、游行、示威、聚众扰乱社会秩序;<br />    10)侮辱或者诽谤他人,侵害他人名誉、隐私和其他合法权益;<br />    11)通过网络以文字、图片、音视频等形式,对未成年人实施侮辱、诽谤、威胁或者恶意损害未成年人形象进行网络欺凌的;<br />    12)危害未成年人身心健康的;<br />    13)含有法律、行政法规禁止的其他内容;</p> <p><br />2. 不友善:不尊重用户及其所贡献内容的信息或行为。主要表现为:<br />    1)轻蔑:贬低、轻视他人及其劳动成果;<br />    2)诽谤:捏造、散布虚假事实,损害他人名誉;<br />    3)嘲讽:以比喻、夸张、侮辱性的手法对他人或其行为进行揭露或描述,以此来激怒他人;<br />    4)挑衅:以不友好的方式激怒他人,意图使对方对自己的言论作出回应,蓄意制造事端;<br />    5)羞辱:贬低他人的能力、行为、生理或身份特征,让对方难堪;<br />    6)谩骂:以不文明的语言对他人进行负面评价;<br />    7)歧视:煽动人群歧视、地域歧视等,针对他人的民族、种族、宗教、性取向、性别、年龄、地域、生理特征等身份或者归类的攻击;<br />    8)威胁:许诺以不良的后果来迫使他人服从自己的意志;</p> <p><br />3. 发布垃圾广告信息:以推广曝光为目的,发布影响用户体验、扰乱本网站秩序的内容,或进行相关行为。主要表现为:<br />    1)多次发布包含售卖产品、提供服务、宣传推广内容的垃圾广告。包括但不限于以下几种形式:<br />    2)单个帐号多次发布包含垃圾广告的内容;<br />    3)多个广告帐号互相配合发布、传播包含垃圾广告的内容;<br />    4)多次发布包含欺骗性外链的内容,如未注明的淘宝客链接、跳转网站等,诱骗用户点击链接<br />    5)发布大量包含推广链接、产品、品牌等内容获取搜索引擎中的不正当曝光;<br />    6)购买或出售帐号之间虚假地互动,发布干扰网站秩序的推广内容及相关交易。<br />    7)发布包含欺骗性的恶意营销内容,如通过伪造经历、冒充他人等方式进行恶意营销;<br />    8)使用特殊符号、图片等方式规避垃圾广告内容审核的广告内容。</p> <p><br />4. 色情低俗信息,主要表现为:<br />    1)包含自己或他人性经验的细节描述或露骨的感受描述;<br />    2)涉及色情段子、两性笑话的低俗内容;<br />    3)配图、头图中包含庸俗或挑逗性图片的内容;<br />    4)带有性暗示、性挑逗等易使人产生性联想;<br />    5)展现血腥、惊悚、残忍等致人身心不适;<br />    6)炒作绯闻、丑闻、劣迹等;<br />    7)宣扬低俗、庸俗、媚俗内容。</p> <p><br />5. 不实信息,主要表现为:<br />    1)可能存在事实性错误或者造谣等内容;<br />    2)存在事实夸大、伪造虚假经历等误导他人的内容;<br />    3)伪造身份、冒充他人,通过头像、用户名等个人信息暗示自己具有特定身份,或与特定机构或个人存在关联。</p> <p><br />6. 传播封建迷信,主要表现为:<br />    1)找人算命、测字、占卜、解梦、化解厄运、使用迷信方式治病;<br />    2)求推荐算命看相大师;<br />    3)针对具体风水等问题进行求助或咨询;<br />    4)问自己或他人的八字、六爻、星盘、手相、面相、五行缺失,包括通过占卜方法问婚姻、前程、运势,东西宠物丢了能不能找回、取名改名等;</p> <p><br />7. 文章标题党,主要表现为:<br />    1)以各种夸张、猎奇、不合常理的表现手法等行为来诱导用户;<br />    2)内容与标题之间存在严重不实或者原意扭曲;<br />    3)使用夸张标题,内容与标题严重不符的。</p> <p><br />8.「饭圈」乱象行为,主要表现为:<br />    1)诱导未成年人应援集资、高额消费、投票打榜<br />    2)粉丝互撕谩骂、拉踩引战、造谣攻击、人肉搜索、侵犯隐私<br />    3)鼓动「饭圈」粉丝攀比炫富、奢靡享乐等行为<br />    4)以号召粉丝、雇用网络水军、「养号」形式刷量控评等行为<br />    5)通过「蹭热点」、制造话题等形式干扰舆论,影响传播秩序</p> <p><br />9. 其他危害行为或内容,主要表现为:<br />    1)可能引发未成年人模仿不安全行为和违反社会公德行为、诱导未成年人不良嗜好影响未成年人身心健康的;<br />    2)不当评述自然灾害、重大事故等灾难的;<br />    3)美化、粉饰侵略战争行为的;<br />    4)法律、行政法规禁止,或可能对网络生态造成不良影响的其他内容。</p> <p><br />二、违规处罚<br />本网站通过主动发现和接受用户举报两种方式收集违规行为信息。所有有意的降低内容质量、伤害平台氛围及欺凌未成年人或危害未成年人身心健康的行为都是不能容忍的。<br />当一个用户发布违规内容时,本网站将依据相关用户违规情节严重程度,对帐号进行禁言 1 天、7 天、15 天直至永久禁言或封停账号的处罚。当涉及欺凌未成年人、危害未成年人身心健康、通过作弊手段注册、使用帐号,或者滥用多个帐号发布违规内容时,本网站将加重处罚。</p> <p><br />三、申诉<br />随着平台管理经验的不断丰富,本网站出于维护本网站氛围和秩序的目的,将不断完善本公约。<br />如果本网站用户对本网站基于本公约规定做出的处理有异议,可以通过「建议反馈」功能向本网站进行反馈。<br />(规则的最终解释权归属本网站所有)</p> </div> <div class="iknow_rule" style="width: 193px; height: 42px; line-height: 42px; border-radius: 21px; color: #fff; text-align: center; background: linear-gradient(17deg,rgba(255,131,85,1),rgba(255,168,44,1));margin: 25px auto; cursor: pointer">我知道了</div> </div> </div> <div class="fixedtc ans_correct"> <div class="downloadzl_box downloadzl_box2"> <img style="margin-top: 0; width: 16px; height: 16px; position: absolute; top: 25px; right: 16px; cursor: pointer" class="modalclose" src="/img/index/dt_close.png" alt=""> <img src="/img/index/detail_correct.png" alt=""> <div class="downloadzl_reason downloadzl_reason2">恭喜你~答对了</div> <div class="downloadzl_ym">+5羽毛<img src="/img/index/feather.png" alt=""></div> <div style="margin: 20px auto; float: none; width: 165px;" class="downloadzl_right downloadzl_wzdl"><a href="/pc/center/mall">前往领取更多羽毛</a></div> </div> </div> <div class="fixedtc ans_error"> <div class="downloadzl_box downloadzl_box2"> <img style="margin-top: 0; width: 16px; height: 16px; position: absolute; top: 25px; right: 16px; cursor: pointer" class="modalclose" src="/img/index/dt_close.png" alt=""> <img src="/img/index/detail_error.png" alt=""> <div class="downloadzl_reason downloadzl_reason2">下一次认真读哦</div> <div style="margin: 20px auto; float: none; width: 165px;" class="downloadzl_right downloadzl_wzdl downloadzl_klyx"><a href="/pc/center/mall">前往领取更多羽毛</a></div> </div> </div> <div class="fixedtc newshow"> <div class="newBox"> <img class="newBox_img" src="/img/index/newshow.png" alt=""> <img class="newBox_close" src="/img/index/newshow_close.png" alt=""> </div> </div> <div class="fixedtc cointc"> <div class="jrdkBox"> <img style="width: 16px; height: 16px; position: absolute; top: 25px; right: 16px; cursor: pointer" class="modalclose" src="/img/index/dt_close.png" alt=""> <img class="jrdkBox_gif" src="/img/index/point_ym.gif" alt=""> <div class="jrdkBox_reason jrdkBox_reason2">成功推荐给其他人</div> <div class="jrdkBox_ym">+ 10羽毛</div> <div style="margin: 20px auto; float: none; width: 165px;" class="jrdkBox_wzdl iknow_cointc curp downloadzl_right"><a href="/pc/center/mall">前往领取更多羽毛</a></div> </div> </div> <div class="featherselection_fixedmc"> <a class="gologin" href=""><img src="/img/index/go_login.png" alt=""></a> </div> <!-- 评论成功提示 --> <div class="fixedtc comment_succ"> <div class="jrdkBox" style="height: 245px; font-size: 16px;"> <img style="width: 16px; height: 16px; position: absolute; top: 25px; right: 16px; cursor: pointer" class="modalclose" src="/img/index/dt_close.png" alt=""> <div style="width: 340px; margin: 45px auto 20px; font-size: 16px" class="jrdkBox_reason">评论成功且进入审核!审核通过后,您将获得10羽毛的奖励。分享本文章给好友阅读最高再得15羽毛~</div> <div style="text-align: center; margin-bottom: 32px"> <span>(羽毛可至</span> <span class="comment_succ_mall" style="color: #FA8735; text-decoration: underline; cursor: pointer">"羽毛精选"</span> <span>兑换礼品)</span> </div> <div class="jrdkBox_wzdl curp goshare buttonLink">去分享</div> </div> </div> <!-- 分享弹窗 --> <div class="fixedtc sharemodal"> <div class="jrdkBox"> <img style="width: 16px; height: 16px; position: absolute; top: 25px; right: 16px; cursor: pointer" class="modalclose" src="/img/index/dt_close.png" alt=""> <div style="width: 320px; margin: 60px auto;"> <div style="text-align: center; width: 120px; height: 140px; float: left"> <div style="width: 120px; height: 120px; margin-bottom: 5px" id="article_code"></div> <div>好友微信扫一扫</div> </div> <div onclick="myCopy()" style="text-align:center; width: 120px; height: 140px; float: right; cursor: pointer"> <img style="width: 120px; height: 120px; margin-bottom: 5px" src="/img/index/point_fz.png" alt=""> <div>复制链接</div> </div> </div> </div> </div> <div class="advManager"> <img class="advManagerClose" src="/img/resource/bg-advmanager-2.png" alt=""> <img class="advManagerImg" src="/img/resource/bg-advmanager-1.gif" alt=""> </div> <!-- 引流 --> <div class="kf1v1" style="display:none"> <div class="kf1v1Content"> <div class="kf1v1ContentTitle"> <div class="kf1v1TopL"> <div class="kf1v1TopLTitle">顾问推荐营销服务</div> <div class="kf1v1TopLTips">帮你推荐合适的营销服务,专人服务,限时免费体验!</div> </div> <img class="kf1v1TopR" src="/img/resource/icon-1v1-close.png" alt=""> </div> <div class="kf1v1Contain"> <div class="kf1v1Form"> <div class="kf1v1TopGroup"> <img class="kfIcon" src="/img/resource/icon-1v1-kf.png" alt=""> <div class="kfTalk">我是企服顾问 小甜甜,为您提供<strong>免费的、1对1</strong>的营销匹配服务,回答我几个小问题,让我开始为您找合适的营销服务商~</div> </div> <div class="kf1v1GroupList"> <div class="kf1v1Group"> <div class="kf1v1GroupLable">您找营销服务商主要用来做什么?</div> <textarea class="kf1v1GroupText" placeholder="您找营销服务商主要用来做什么?" name="kf1v1GroupText" id="" cols="30" rows="10"></textarea> </div> <div class="kf1v1Group"> <div class="kf1v1GroupLable">找到合适的服务商后如何联系您?</div> <input class="kf1v1GroupPhone" name="kf1v1GroupPhone" maxlength="11" type="text" placeholder="请输入您的常用手机号码"> <input class="kf1v1GroupSms" name="kf1v1GroupSms" maxlength="4" type="text" placeholder="请输入验证码"> <div class="kf1v1GroupBtn" onclick="sendSms()" data-enable="true">发送验证码</div> </div> <div class="kf1v1SubmitBtn">帮我推荐服务商</div> </div> </div> <!-- 右侧 --> <div class="kf1v1ContainR"> <div class="kf1v1RuleItem"> <img class="kf1v1RuleIcon" src="/img/resource/icon-1v1-step1.png" alt=""> <div class="kf1v1RuleR"> <div class="kf1v1RuleTitle">信息收集</div> <div class="kf1v1RuleTip">通过简单的几个问题收集您的信息</div> </div> </div> <div class="kf1v1RuleItem"> <img class="kf1v1RuleIcon" src="/img/resource/icon-1v1-step2.png" alt=""> <div class="kf1v1RuleR"> <div class="kf1v1RuleTitle">精准查找</div> <div class="kf1v1RuleTip">企服顾问根据您的需要和情况,精准查找最适合您的服务商</div> </div> </div> <div class="kf1v1RuleItem"> <img class="kf1v1RuleIcon" src="/img/resource/icon-1v1-step3.png" alt=""> <div class="kf1v1RuleR"> <div class="kf1v1RuleTitle">专人服务</div> <div class="kf1v1RuleTip">找到合适的服务商后,主动联系您回复服务商详情</div> </div> </div> </div> </div> </div> </div> <textarea name="" id="text" cols="30" rows="10" style="position:absolute;left:-9999999999999px;"></textarea> </div> <!-- <div style="height: 140px; background: #f7f7f7; position: relative; z-index: 1"></div> --> <div style="z-index: 1"> <style> html,body{ min-width:1280px; } .gov_item_box{ padding-top:10px; } .gov_item { display: inline-block; border: 1px solid #ddd; margin-left: 8px; padding-right: 1em; height: 30px; line-height: 30px; color: #666; font-size: 12px; cursor: pointer; overflow: hidden; background:#f5f5f5; } .gov_item1{ margin-left:0; } .gov_item i { float: left; background: url('/img/gov_icon.png') no-repeat; } .gov_item1 i { width: 17px; height: 15px; background-position: -50px 0; margin: 7px 8px 0 6px; } .gov_item3 i { width: 17px; height: 18px; background-position: -50px -100px; margin: 7px 3px 0 8px; } .gov_item4 i { width: 19px; height: 19px; background-position: -50px -150px; margin: 5px 6px 0; } .gov_item5 i { width: 23px; height: 23px; background-position: -50px -200px; margin: 2px 6px 0 7px; } .gov_item2 i { width: 17px; height: 19px; background-position: -50px -50px; margin: 5px 10px 0 8px; } .footerItem:hover .gap img { opacity: 0.01; } .footerItem .gap:hover img { opacity: 1; } .featherselection_fixedmc{ display:none; } .app_download_code1 { /* background-image: url("/img/aboutus/xms3.png"); */ width: 102px; height: 105px; background-size: contain; position:absolute; left: -23px; top: 83px; padding: 5px; background: #fff; } </style> <div class="footer mobileHide"> <div class="footerLi"> <div class="footerLi1"> <div class="footerList clearfix"> <img class="footer_pic1" src="/img/index/footer_pic1.png" alt=""> <img class="footer_pic2" src="/img/index/footer_pic2.png" alt=""> <div class="footerItem footerItemContact2"> <p class="footerTitle">公司简介</p> <p><a style="line-height: 30px; float:left" href="/pc/index/aboutus" target="_blank">鸟哥笔记-讲述营销的故事!始创于2010年,专注于营销界专业知识分享、营销资源对接,赋能营销从业者。内容涵盖广告、营销、运营、推广、品牌等细分领域知识及资源对接服务<span style="cursor: pointer;display:inline;margin-left:2px;" href="/pc/index/aboutus">查看更多></span></a></p> </div> <div class="footerItem footerItemAbout"> <p class="footerTitle">关于</p> <ul class="space"> <p><a href="/pc/index/aboutus">关于我们</a></p> <p><a href="https://www.lagou.com/gongsi/j123114215.html">加入我们</a></p> <p><a href="http://niaogebj.mikecrm.com/FVEhsoN">反馈举报</a></p> <p><a class="hover" href="https://www.niaogebiji.com/pc/index/contactus">联系我们</a></p> <div class="app_download_code1" style="display:none"> <img style="width:100%;height:100%;" src="/img/aboutus/xms3.png" alt=""> </div> </ul> <ul> <p><a href="https://www.niaogebiji.com/pc/index/copyright">《版权及免责声明》</a></p> <p><a href="https://www.niaogebiji.com/pc/index/agreement">《用户协议》</a></p> <p><a href="https://www.niaogebiji.com/pc/index/privacy">《隐私协议》</a></p> <p> <a href="https://www.niaogebiji.com/pc/marketing/home">商务合作</a></p> </ul> </div> <div class="footerItem nav_module"> <div class="footerTitle">网站导航</div> <nav> <ul> <li><a href="/">首页</a></li> <li><a href="/bulletin">今日事</a></li> <li> <a href="/cat/1">运营</a> <ul class="childUrl"> <li><a href="/cat/103">新媒体</a></li> <li><a href="/cat/101">用户运营</a></li> <li><a href="/cat/102">活动运营</a></li> <li><a href="/cat/104">数据运营</a></li> </ul> </li> <li> <a href="/cat/2">推广</a> <ul class="childUrl"> <li><a href="/cat/105">ASO</a></li> <li><a href="/cat/106">SEM</a></li> <li><a href="/cat/107">信息流</a></li> <li><a href="/cat/108">营销推广</a></li> <li><a href="/cat/114">品牌策略</a></li> </ul> </li> </ul> <ul> <li> <a href="/cat/3">综合</a> <ul class="childUrl"> <li><a href="/cat/109">行业动态</a></li> <li><a href="/cat/112">课程活动</a></li> <li><a href="/cat/110">职场成长</a></li> <li><a href="/special">干货专题</a></li> </ul> </li> <li><a href="/author">专栏</a></li> <li><a href="/pc/index/tag">分类标签</a></li> <li><a href="/pc/resource/esall">服务商大全</a></li> <!-- <li><a href="/cat/111">资料</a></li> --> <!-- <li><a href="/academy/#/academy/course">学院</a></li> --> </ul> </nav> </div> <div class="footerItem download_module"> <div class="footerTitle">下载APP</div> <img class="code" src="/img/index/app_download_code3_1.jpg" alt=""> </div> <div style="height: 15px"></div> </div> </div> <div class="footerBottom"> <p> <span>Powered by QINGMOB PTE. LTD. © 2010-2022 上海青墨信息科技有限公司 </span> <a href="https://beian.miit.gov.cn/" target="_blank">沪ICP备2021034055号-6</a> </p> <div class="gov_item_box"> <a target="_blank" href="https://www.12377.cn/" class="gov_item gov_item1"><i></i><span>国家互联网举报中心</span></a> <a target="_blank" href="https://www.shjbzx.cn/" class="gov_item gov_item3"><i></i><span>上海互联网举报中心</span></a> <a target="_blank" href="http://www.cyberpolice.cn/" class="gov_item gov_item5"><i></i><span>网络110报警服务</span></a> <a target="_blank" href="http://www.beian.gov.cn/portal/registerSystemInfo?recordcode=31011002005551" class="gov_item gov_item2"><i></i><span>沪公网安备31011002005551号</span></a> </div> </div> </div> </div> <div class="featherselection_fixedmc mobileHide"> <img class="go_close mobileHide" src="/img/index/ydgb.png" alt=""> <a class="gologin mobileHide" href="javascript:;"><img src="/img/index/go_login.png" alt=""></a> </div> <script> var _hmt = _hmt || []; (function() { var hm = document.createElement("script"); hm.src = "https://hm.baidu.com/hm.js?b287ed19e06795af7a2b7f4609d48b1d"; var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(hm, s); })(); </script> <script> function openWin() { let url = 'http://p.qiao.baidu.com/cps/chat?siteId=13189166&userId=10076563&cp=www.niaogebiji.com&cr=web1&cw=web1' window.open(url, 'newwindow', 'height=600, width=800, top=30%,left=30%, toolbar=no, menubar=no, scrollbars=no, resizable=no,location=no, status=no'); } $(function(){ $(".footerItem .hover").mouseover(function() { $(".app_download_code1").show() }) $(".footerItem .hover").mouseout(function() { $(".app_download_code1").hide() }) // var login_url = "//" var is_login = "0"; $('.go_close').click(function () { $('.featherselection_fixedmc').hide() }) $('.featherselection_box').on('click',".featherselection_list",function () { if(is_login == 0){ // loginInit(); $('.featherselection_fixedmc').show() }else{ window.open('/pc/center/mall') } }) $('.featherselection').on('click',".featherselection_titleimg",function () { if(is_login == 0){ loginInit(); $('.featherselection_fixedmc').hide() }else{ window.open('/pc/center/mall') } }) $('[data-src]').click(function(){ var $this = $(this); var src = $this.data('src'); $this.addClass('on').siblings().removeClass('on'); $this.parent().next().css('background-image', 'url('+src+')'); }); var oldWidth; $('.moreFriendLink').click(function(){ oldWidth = $('.friendLink').width(); $('.friendLink').width(410).find('li').addClass('compactLink').show(); $(this).parent().hide(); }); $('.lessFriendLink').click(function(){ $('.friendLink').width(oldWidth).find('li').removeClass('compactLink').show(); $('.extraLink').hide(); }) }); $('.headMain>li').mouseenter(function () { $(this).addClass('active').siblings().removeClass('active'); $(this).siblings().children('.navItem').hide(); $(this).children('.navItem').show(); }).mouseleave(function () { $(this).removeClass('active'); $('.navItem').hide(); $('.current').children('.navItem').show(); }); $('button.search').click(function(){ window.open("https://aso.niaogebiji.com/index/search?wd="+encodeURIComponent($('input.name').val()),"newwindow"); }); $('input.name').keydown(function(e){ if(e.keyCode==13){ window.open("https://aso.niaogebiji.com/index/search?wd="+encodeURIComponent($('input.name').val()),"newwindow"); } }); $('.gologin').click(function(){ $('.featherselection_fixedmc').hide(); loginInit(); }) $('.headerBtn').click(function () { //搜索文章或问吧 }); </script> <script> //bi统计uv、pv // $.ajax({ // type:'POST', // url:'/index/bistat/', // dataType:'json', // data:{}, // success: function(result){ // }, // error: function(result, status){ // } // }); </script> <script> if($('a:last').html()=='站长统计'){ $('a:last').hide() } </script> <script> (function(){ var bp = document.createElement('script'); var curProtocol = window.location.protocol.split(':')[0]; if (curProtocol === 'https') { bp.src = 'https://zz.bdstatic.com/linksubmit/push.js'; } else { bp.src = 'http://push.zhanzhang.baidu.com/push.js'; } var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(bp, s); })(); </script> </html> </div> <script src="/js/main.js"></script> <script src="https://static.jmlk.co/scripts/dist/jmlink.min.js"></script> <script src="/js/viewer.js"></script> <script src="/js/js.cookie.js"></script> <script type="text/javascript"> window.onbeforeunload = onbeforeunload_handler; function onbeforeunload_handler(){ } </script> <script> var isLogin = false; var width = 0; let num = $('.articleItem').length; width = num * 182 + num * 16; $('.recArticleItems').css('width', width + 20 + 'px'); (function(){ let doms = Array.from(document.getElementsByClassName('pc_content')) doms.forEach(item => { if(!item.viewer) { new Viewer(item, { navbar: 3, toolbar: {prev: true, next: true}, loading: true, title: false }) } }) // var left = $('.rankingBox').offset().left; // var top = $('.rankingBox').offset().top; // var height = $('.rankingBox').height(); // $('.cooperationFix').css('left',left+'px'); // $('.cooperationFix').css('top',top+height+30+'px'); $('iframe').css('min-width','600px;') })() $(window).scroll(function(){ var top = 0; var resHeight = $('.contentRight').height() + $('.page_top').height()-30 ; console.log($(window).scrollTop(),resHeight) if($(window).scrollTop() > resHeight){ $('.gzh-box').addClass('gzh-fix'); }else{ $('.gzh-box').removeClass('gzh-fix'); } }); // var login_url = "//" var isFavorite = '0' var my_point = '0' var isFollow = '0' var article_point = '0' function showArticlePoint() { $('.article_point').html(article_point!=0?article_point:'暂无') } showArticlePoint() function actionIconLight(isFavorite, my_point) { ///控制action_icon高亮 if(isFavorite != 0) { $('.collect_status1').hide() $('.collect_status2').show() }else { $('.collect_status1').show() $('.collect_status2').hide() } if(my_point != 0) { $('.grade_status1').hide() $('.grade_status2').show() }else { $('.grade_status1').show() $('.grade_status2').hide() } } actionIconLight(isFavorite, my_point) // 收藏图标 $(".action_item1").mouseover(function(){ actionIconLight(1, my_point) }) $(".action_item1").mouseout(function(){ actionIconLight(isFavorite, my_point) }) // 评分图标 $(".action_item2").mouseover(function(){ actionIconLight(isFavorite, 1) }) $(".action_item2").mouseout(function(){ actionIconLight(isFavorite, my_point) }) // 评论图标 $(".action_item3").mouseover(function(){ $('.comment_status1').hide() $('.comment_status2').show() }) $(".action_item3").mouseout(function(){ $('.comment_status1').show() $('.comment_status2').hide() }) // 评分、评论动画 $('.action_item2').click(function() { $('html, body').animate({scrollTop: $('#grade_module').offset().top - 300}, 800) }) $('.action_item3').click(function() { $('html, body').animate({scrollTop: $('#comment_anchor').offset().top - 300}, 800) }) $(function() { Cookies.set('saveuserid',UID, { expires: 365, path: '/' }); var saveuserid = Cookies.get('saveuserid'); if(isFollow === '1') { $('.has_follow_btn').show() $('.not_has_follow_btn').hide() }else { $('.has_follow_btn').hide() $('.not_has_follow_btn').show() } }) $(function() { var top = 0, bot = 0; $(window).on('scroll', function() { top = $(this).scrollTop() setTimeout(() => { bot = top; }, 0); $('.article').each(function(i, e) { if (isBlockBelowInViewport(e)) { if (top <= bot) { //下滚 $('.articleControlBox').addClass('is-fixed').addClass('is-fixed-top').removeClass('is-fixed-bottom') } else { //上滚 $('.articleControlBox').addClass('is-fixed').removeClass('is-fixed-top').addClass('is-fixed-bottom'); } }else { $('.articleControlBox').removeClass('is-fixed').removeClass('is-fixed-top').removeClass('is-fixed-bottom') } }); }); $('.promoteAuthorFocusBtn, .follow_btn').on('click', function(e) { e.preventDefault(); followAuthorArticleDetail(this); }); }); function followAuthorArticleDetail(el) { var uid = UID; if (!uid){///未登录 loginInit(); return } var value = $(el).data('value'); var author_id = $(el).data('author'); var $this = $(el); $.post('/pc/author/follow?author='+author_id+'&value='+(1-value), function (ret) { $this.data('value', 1-value); if (ret.return_code === '0') { if(isFollow === '1') { isFollow = '0' $('.has_follow_btn').hide() $('.not_has_follow_btn').show() }else { isFollow = '1' $('.has_follow_btn').show() $('.not_has_follow_btn').hide() } } else { //// } }, 'json'); } </script> <script> /////// 测一测 下载资料逻辑 $(function() { window.onload = function() { let h = sessionStorage.getItem(window.location.href) if (h) { document.documentElement.scrollTop = parseInt(h);     document.body.scrollTop = parseInt(h); sessionStorage.removeItem(window.location.href) } } var is_mobile = "0"; var is_login = "0"; var is_new_time = false // var ACCOUNT_DOMAIN = '//'; var is_new_user = "0"; var is_downzl = ""; var dl_point = ""; var mypoint = ""; var not_read = "0"; var wzaid = "62019"; var is_yd = true var ans = "" var rightans = "" var is_dl = "0"; if (is_dl == 1) { $('.downBox_button1').hide() $('.downBox_button2').show() } else { $('.downBox_button1').show() $('.downBox_button2').hide() } if (ans == '') { } else { $('.testBox_ansbox_sub').hide() $('.testBox_ansbox_sub2').show() } var is_new_usershow = Cookies.get('usershow'); var clsoeqpshow = Cookies.get('clsoeqpshow'); // console.log(is_new_usershow) if (clsoeqpshow == 'true') { $('.close_box').hide() } $('.close_buttom').click(function() { $('.close_box').hide() Cookies.set('clsoeqpshow', 'true', { expires: 365, path: '/' }); }) setTimeout(() => { is_new_time = true }, 120000); var flag = false $(window).on('scroll', function() { var top = $(this).scrollTop() var boxh = $('.containerBox').height() var wzh = $('.article').height() if (top >= boxh / 3 * 2) { if (is_login == 0 && flag == false) { flag = true // $('.login_url').attr('href', login_url) if (is_mobile != '1') { $('.nologtip').show() showLoginPopup(wzaid) } } } if (is_new_time == true || top >= boxh / 3 * 2) { if (is_new_user == 1 && is_new_usershow != '4') { if (is_new_usershow == undefined) { is_new_usershow = 1 //第一次进来 } else { is_new_usershow = parseInt(is_new_usershow) + 1 //第2次进来 } $('.newshow').show() Cookies.set('usershow', is_new_usershow, { expires: 365, path: '/' }); } } }) $('.showrulebtn').click(function() { ////显示评论规则弹窗 $('.commentRule').show() }) $('.iknow_rule').click(function() { $('.commentRule').hide() }) $('.testBox_ansbox_sub').click(function() { if (is_login == 0) { loginInit(); return 0 } var aid = $(this).data('aid') var value = $('input:radio:checked').val(); // console.log(value) if (value == undefined) { } else { $(this).hide() var correct = rightans $('.testBox_ansbox_sub2').show() answerArticleQa(aid, value, (res) => { let r = JSON.parse(res) if (value == correct) { if (r.return_data.is_show_tip === '1') { $('.ans_correct').css('display', 'inline-block') } } else { $('.ans_error').css('display', 'inline-block') } $('.testBox_ansbox_ans').eq(rightans - 1).children().css('display', 'inline-block') }) } }) $('.downBox_button1').click(function() { if (is_dl == 1) { $('.qrxz').show() return 0 } if (parseInt(mypoint) >= parseInt(dl_point)) { $('.qrxz').show() } else { $('.ymbz').show() } }) $('.comment_succ_mall').click(function() { window.location.href = '/pc/center/mall' }) $('.modalclose').click(function() { $('.comment_succ').hide() $('.sharemodal').hide() $('.cointc').hide() $('.ans_correct').hide() $('.ans_error').hide() }) $('.goshare').click(function() { let url = 'https://www.niaogebiji.com/article-62019-1.html' $('#article_code').html('') $('#article_code').qrcode({ width: 120, height: 120, text: url }); $('.comment_succ').hide() $('.sharemodal').show() }) $('.iknow_cointc').click(function() { $('.cointc').hide() }) $('.downloadzl_klyx').click(function() { $('.fixedtc').hide() }) $('.downloadzl_colse').click(function() { $('.fixedtc').hide() closeLoginPopup(wzaid) }) $('.newBox_close').click(function() { $('.newshow').hide() }) $('.downloadzl_ljxz').click(function() { if (is_dl == 1) { return 0 } $('.downBox_button1').hide() $('.downBox_button2').show() var aid = $(this).data('aid') $('.qrxz').hide() dlArticle(aid) }) //展示弹窗: function showLoginPopup(aid) { $.ajax({ url: '/pc/article/showLoginPopup/', data: { aid: aid }, method: 'POST', success: (res) => { // console.log(res) var data = JSON.parse(res) if (data.return_code == '200') { } }, error: (err) => { console.log(err) } }) } //关闭弹窗: function closeLoginPopup(aid) { $.ajax({ url: '/pc/article/closeLoginPopup/', data: { aid: aid }, method: 'POST', success: (res) => { // console.log(res) var data = JSON.parse(res) if (data.return_code == '200') { } }, error: (err) => { console.log(err) } }) } function dlArticle(aid) { $.ajax({ url: '/pc/article/dlArticle/', data: { aid: aid }, method: 'POST', success: (res) => { // console.log(res) }, error: (err) => { console.log(err) } }) } function readArticle(aid) { $.ajax({ url: '/pc/article/readArticle/', data: { aid: aid }, method: 'POST', success: (res) => { // console.log(res) var data = JSON.parse(res) if (data.return_code == '200') { if (data.return_data.is_show_tip == '1') { $('.jrdkBox_reason2').html('每天阅读文章') $('.jrdkBox_ym').html('+ 5羽毛') $('.cointc').show() } } }, error: (err) => { console.log(err) } }) } function answerArticleQa(aid, answer_no, cb) { $.ajax({ url: '/pc/article/answerArticleQa/', data: { aid: aid, answer_no: answer_no }, method: 'POST', success: (res) => { cb(res) /// }, error: (err) => { console.log(err) } }) } }) function adv_click(id) { $.ajax({ type: 'POST', url: '/index/advstat/', dataType: 'json', data: { id:id, type: 2 }, success: function (result) { }, error: function (result, status) { } }); } </script> <script> let midMark = true let bottomMark = true let advBottomMark = true document.addEventListener('scroll', function(event) { let h1 = $('.breadcrumbBoxWrap').height() + $('.rankingBox').height() + $('.download_app_module').height() + 33; //右侧布局区高度-延伸阅读区高度 let h2 = $('.article').height();//文章内容区高度 let h3 = $('.contentLeft').height();//左边整个布局的高度(包括文章内容区) let pageTopHeight = 100; // if(document.body.clientWidth > 750) { ///pc // pageTopHeight = Number($('.page_top').height())+7;//7px是下边距 // if($(event.target).scrollTop() >= h1) { // if($(event.target).scrollTop() >= (h3 -470)) { ///跟着底部上去 // $('.fixedBox').css({ // position: 'absolute', // marginTop: (h3-565) + 'px', // }) // } else { // $('.fixedBox').css({ ///固定在右上角 // position: 'fixed', // top: pageTopHeight + 'px', // bottom: 'auto', // marginTop:0 // }) // } // } else { // $('.fixedBox').css({ ///刚进入页面 // position: 'static', // top: pageTopHeight + 'px', // bottom: 'auto', // marginTop:0 // }) // } // } /////友盟数据统计 let scrollTop = $(event.target).scrollTop() ///滚动距离 if(midMark && scrollTop >= h2/2) { midMark = false // console.log('mid') } if(bottomMark && scrollTop >= h2/6*5) { bottomMark = false // console.log('bottom') } if(advBottomMark && scrollTop >= h2/7*6) { advBottomMark = false // console.log('bottom2') } }, true); </script> <script> $(document).ready(function() { var my_point = 0; var stepW = 24 var description = new Array('1', '2', '3', '4', '5'); var stars = $("#star > li"); var descriptionTemp; $("#showb").css("width", stepW * my_point); stars.each(function(i) { $(stars[i]).click(function(e) { if(my_point > 0) { ///已评分 return } var n = i + 1; var aid = $('.action_item1').data('id'); $("#showb").css({ "width": stepW * n }); descriptionTemp = n; // if(!isLogin){ loginInit(); return false; } $.ajax({ url: '/pc/center/addArticlePoint/', dataType: 'JSON', data: { aid: aid, point: descriptionTemp }, success: function(res) { if (res.return_code === '200') { ///修改悬浮条收藏icon状态 my_point = 1 actionIconLight(isFavorite, my_point) if (res.return_data.is_show_tip_com === 1) { $('.jrdkBox_reason2').html('评分') $('.jrdkBox_ym').html('+ 5羽毛') $('.cointc').show() } article_point = res.return_data.article_point showArticlePoint() } else { if (res.return_code === '1000') { // swal({ // title: res.return_msg, // type: "warning", // showCancelButton: true, // confirmButtonText: "去登录", // cancelButtonText: "取消", // closeOnConfirm: true, // closeOnCancel: true // }, function(isConfirm) { // if (isConfirm) { // window.location.href = login_url; // } // }) loginInit(); } else { swal(res.return_msg); } } } }) return descriptionTemp; }); }); stars.each(function(i) { $(stars[i]).hover( function() { $(".description").text(description[i]); }, function() { if (descriptionTemp != null) { $(".description").text(descriptionTemp); } else { $(".description").text(" "); } } ); }); }); function stopDefault(e) { if (e && e.preventDefault) e.preventDefault(); else window.event.returnValue = false; return false; }; </script> <script> //复制 function myCopy() { let url = 'https://www.niaogebiji.com/article-62019-1.html'; $('#text').html(url) var ele = document.getElementById("text"); ele.select(); document.execCommand("Copy"); alert('复制成功') } $('.fixedmc').on("click", ".knowtop", function() { $('.knowtop').hide() $('.knowleftbox').show() }) $('.fixedmc').on("click", ".knowleft", function() { $('.knowleftbox').hide() $('.knowrightbox').show() }) $('.fixedmc').on("click", ".knowright", function() { $('.knowrightbox').hide() $('.fixedmc').hide() $('html').css("overflow", 'scroll') var num = Cookies.get('numtip'); if (num == undefined) { Cookies.set('numtip', 1, { expires: 365, path: '/' }); } else if (num == 1) { Cookies.set('numtip', 2, { expires: 365, path: '/' }); } else if (num == 2) { Cookies.set('numtip', 3, { expires: 365, path: '/' }); } }) $('.extensionRead_list').on("click", ".extensionRead_list_item", function() { var data = $(this).data(aid) var aid = data.aid var pos; if (data.bindex == 0) { pos = 'read_more_1' } else if (data.bindex == 1) { pos = 'read_more_2' } else if (data.bindex == 2) { pos = 'read_more_3' } $.ajax({ url: '/pc/article/positionCount/', dataType: 'JSON', data: { aid: aid, pos: pos, }, success: function(res) { } }) }) $('.articleControlBox').on("click", ".ljicon", function() { var data = $(this).data(aid) var aid = data.aid var pos = 'copy_button'; $.ajax({ url: '/pc/article/positionCount/', dataType: 'JSON', data: { aid: aid, pos: pos, }, success: function(res) { // console.log(res) } }) }) $('.promoteAuthorSummary').on("click", ".here", function() { var data = $(this).parent().data(aid) var aid = data.aid var pos = 'author_apply'; $.ajax({ url: '/pc/article/positionCount/', dataType: 'JSON', data: { aid: aid, pos: pos, }, success: function(res) { // console.log(res) } }) }) $('.action_item1').click(function() {//收藏 if(!isLogin){ loginInit(); return false; } var title = $(this).data('title'); var aid = $(this).data('id'); $.ajax({ url: '/pc/center/addfavorite/', dataType: 'JSON', data: { id: aid, title: title, type: 1 }, success: function(res) { if (res.return_code === '200') { if (isFavorite == 0) { ///修改悬浮条收藏icon状态 isFavorite = 1 actionIconLight(isFavorite, my_point); } else { ///修改悬浮条收藏icon状态 isFavorite = 0 actionIconLight(isFavorite, my_point) } }else if(res.return_code == '1003') { loginInit(); }else { /// } } }) }) $(function() { var timestamp = (new Date()).getTime(); Cookies.set('timestamp', timestamp, { expires: 365, path: '/' }); var newtime = Cookies.get('timestamp'); var num = Cookies.get('numtip'); if (timestamp - newtime >= 86400000) { // console.log(11) Cookies.set('timestamp', timestamp, { expires: 365, path: '/' }); } // 点赞 var url = window.location.href $("#text").html(url) $('.upButton').click(function(e) { e.preventDefault(); upArticle(this); }); var imgWidth, imgHeight; if (ispc) { $(".article img").each(function(index, value) { imgWidth = $(value).attr('width'); imgHeight = $(value).attr('height'); if (imgWidth) { $(value).css({ 'width': imgWidth, 'height': imgHeight }) } }); } var userImg = ""; var userName = ""; // bindFavBtn($('body'), '///account/login?redirect=//'); var commitFlag = true; var aid = 62019; $('.firstSubmitBtn').click(function() { ///发布评论 var text = $('#first-level-review').val(); $.ajax({ type: 'get', url: '/pc/article/publishcomment', dataType: 'JSON', data: { aid: aid, user: true, cid: '', content: text, title: "带你重新认识身边的前端工程狮" }, success: function(res) { if (res.return_code == '200') { $('#first-level-review').val(''); $('.comment_succ').show() } else { swal(res.return_msg); } }, error: function() { swal("出错了!", '请求服务器失败', "error"); } }) }); $('.commentList').on('click', '.secondSubmitBtn', function() { var _this = this; var text = $(this).parents('.replyBox').find('textarea').val(); var cid = $(this).parents('.firstItem').data('cid'); $.ajax({ type: 'get', url: '/pc/article/publishcomment', dataType: 'JSON', data: { aid: aid, user: 1, cid: cid, content: text, title: "带你重新认识身边的前端工程狮" }, success: function(res) { if (res.return_code == '200') { $(_this).parents('.replyBox').hide(); swal('回复成功!您的回复将进入审核阶段'); $(_this).parents('.replyBox').find('textarea').val(''); } else { swal(res.return_msg); } }, error: function() { swal("出错了!", '请求服务器失败', "error"); } }) }); $('.commentList').on('click', '.reply', function() { $(this).parents('.firstItem').find('.replyBox').toggle() }) // $('.weboicon').click(shareWeiboCnzz); // 广告位固定 }) var numPage = 0; var listLength = $('.hotCompanyList').length - 1; $('.pageNum div').click(function () { $(this).addClass('activeNum').siblings().removeClass('activeNum'); numPage = $(this).index(); $('.hotCompanyListAll').animate( { marginLeft: -354 * numPage, }, 300 ); }); // 关闭1v1广告 $('.advManagerClose').click(function () { $('.kf1v1').show(); }); $('.advManagerImg').click(function(){ $('.kf1v1').show(); }) /////1v1对接///// function checkPhone(phone) { ///验证电话号码 return /^1[3456789]\d{9}$/.test(phone); } function count_down(param) { $(`.${param}`).data('enable', 'false'); $(`.${param}`).text('倒计时' + count + 's'); if (count == 0) { $(`.${param}`).data('enable', 'true'); $(`.${param}`).text('获取验证码'); count = 59; clearInterval(intervalid); } count--; } //发送验证码 function sendSms() { var enable = $(`.kf1v1GroupBtn`).data('enable'); if (enable == 'false') { return; } $(`.kf1v1GroupBtn`).data('enable', 'false'); var phone = $('.kf1v1GroupPhone').val(); if (!checkPhone(phone)) { $(`.kf1v1GroupBtn`).data('enable', 'true'); swal('请填写正确的手机号'); return; } $.ajax({ url: '/index/getCode', // 进行二次验证 type: 'post', dataType: 'json', data: { type: 'pc', mobile: phone, }, success: function (data) { if (data.return_code == 200) { intervalid = setInterval(() => { count_down('kf1v1GroupBtn'); }, 1000); } else { $(`.kf1v1GroupBtn`).text('获取验证码'); $(`.kf1v1GroupBtn`).data('enable', 'true'); swal(data.return_msg); } }, error: function (data) {}, }); } // 关闭1对1 $('.kf1v1TopR').click(function () { $('.kf1v1GroupText').val(''); $('.kf1v1GroupSms').val(''); $('.kf1v1GroupPhone').val(''); $('.kf1v1').hide(); }); //提交 $('.kf1v1SubmitBtn').click(function () { var kf1v1GroupText = $('.kf1v1GroupText').val(); if (kf1v1GroupText == '') { swal('请填写找营销服务商主要用来做什么'); return false; } var kf1v1GroupSms = $('.kf1v1GroupSms').val(); var kf1v1GroupPhone = $('.kf1v1GroupPhone').val(); if (kf1v1GroupSms == '' && kf1v1GroupPhone == '') { swal('请填写手机和验证码'); return false; } $.ajax({ url: '/pc/resource/adviser', data: { mobile: kf1v1GroupPhone, code: kf1v1GroupSms, content: kf1v1GroupText }, method: 'POST', dataType: 'json', success: (res) => { if (res.return_code == 1018) { swal('操作过于频繁,请稍候再试。'); } if (res.return_code == 1004) { swal('验证码错误。'); } else if (res.return_code == 200) { swal('操作成功。请等待工作人员审核。'); $('.kf1v1GroupText').val(''); $('.kf1v1GroupSms').val(''); $('.kf1v1GroupPhone').val(''); $('.kf1v1').hide(); } else { swal('参数错误。'); } }, error: (err) => { console.log(err); }, }); }); /////1v1对接///// </script>