整合营销服务商
电脑端+手机端+微信端=数据同步管理
免费咨询热线：
电脑端+手机端+微信端=数据同步管理
免费咨询热线：
在HTML中创建超链接非常简单，只需用标签环绕需要被链接的对象即可，其基本语法格式如下：
<a href="跳转目标" target="目标窗口的弹出方式">文本或图像</a>href属性：链接的地址，链接的地址可以是一个网页，也可以是一个视频、图片、音乐等等。
target属性：
可以打开别人的网页：
<a href="https://www.baidu.com">在当前窗口打开百度</a><a href="https://www.baidu.com" target="_self">在当前窗口打开百度</a><a href="https://www.baidu.com" target="_blank">在新的窗口打开百度</a>直接链接内部页面名称即可：
<a href="1.外部链接.html">打开内部链接</a>如果当时没有确定链接目标时，通常将链接标签的href属性值定义为“#”(即href="#")，表示该链接暂时为一个空链接：
<a href="#">空链接</a>通过创建锚点链接，用户能够快速定位到目标内容。创建锚点链接分为两步：
<h1 id="top">顶部</h1>...<a href="#top">回到顶部</a>跳转到其他页面：
<a href="5.锚点链接2.html#top">回到另一个页面顶部</a>5.锚点链接2.html
<h1 id="top">顶部</h1>base 可以设置整体链接的打开状态
base 写到 head 之间
<head> <meta charset="utf-8"> <title>文档标题</title> <base target="_blank"></head><body> <a href="http://www.baidu.com">在新窗口打开百度</a> <a href="http://www.baidu.com" target="_self">在当前窗口打开百度</a></body><body link="red" alink="yellow" vlink="green"> <a href="https://taobao.com">淘宝</a> <a href="https://jingdong.com">京东</a></body>辑导语：产品经理在日常工作中会接触到多方面的同事，也会产生比较多的交流，那除了接受需求以及判断需求以外，更多的是与开发小哥“battle”；本文作者分享了关于前端开发工程师的一些工作日常，我们一起来了解一下。
今天要介绍的是产品经理的小伙伴之一：前端开发工程师，虽然天天和他们打交道，但是想必大家都没有好好的“关心”过他们，今天我们一起来看看天天接触的前端工程师到底在忙些什么。
现在移动互联网发展的这么快，前端开发领域也越来越广，前端早已经告别了切图崽的时代，在web端、移动端（安卓、IOS）、Watch、小程序、公众号开发、混合app开发都能看到前端开发工程师的影子。
从狭义上讲，前端工程师使用 HTML、CSS、JavaScript 等专业技能和工具将产品UI设计稿实现成网站产品，涵盖用户PC端、移动端网页，处理视觉和交互问题。
从广义上来讲，所有用户终端产品与视觉和交互有关的部分，都是前端工程师的专业领域。
简单的说，前端开发工程师日常工作是创建Web页面或移动页面等前端界面呈现给用户的过程，通过前端三大件HTML、CSS、JavaScript以及衍生出来的各种技术、框架、解决方案，来实现互联网产品的用户界面交互 。
用户看到的每一个网页主要由三部分组成：结构（ Structure） 、 表现（ Presentation） 和行为（ Behavior）。
HTML、CSS、JavaScript是前端开发中最基本也是最必须的三个技能；前端开发中，在页面的布局时， HTML将元素进行定义，CSS对展示的元素进行定位，再通过JavaScript实现相应的效果和交互。接下来我们好好聊聊这三大件，知己知彼。
可以把HTML结构想象成一个没穿衣服的人。
HTML指超文本标记语言（HyperText Markup Language），“超文本”就是指页面内可以包含图片、链接，甚至音乐、程序等非文字元素；前端开发利用HTML标签（Tag）来标记（Markup）网页中的文字。
（html代码示例）
上述代码是一个最基础HTML结构，一个网页的结构往往包括“头”和“主体”，头部的内容使用header标签标记，主要存放一些网页信息，例如网页标题、内容摘要、关键词等，头部内容也是SEO优化的重要对象。
主体部分用标签body标签标记，网页的内容全部放在body标签下，其内部又包含了很多代表不同含义的标签（如下表所示，只展示部分常用的）。
这些形形色色的标签就构成了页面的内容，要注意的是整个网页的内容都要放在一个顶层标签html标签下。
（常用标签）
例如：我们点击某个链接，然后自动跳转一个新的页面，这过程都是a标签在起作用；还有看到的图片，就是img标签承载图片的数据源。
最后，告诉大家两个查看HTML源码的方法，好奇的伙伴可以去试试。
可以把CSS想象成给一个没穿衣服的人(HTML结构)化妆、穿衣服等，作用是让它变得美美的 。
CSS 指层叠样式表（Cascading Style Sheets），是一种将网页内容与网页样式分离的技术。
我们经常会对一个网站评价道：这网站页面怎么这么乱、这网站看起来真大气——这背后都是受CSS影响。
CSS可以做什么？
1）CSS主要用来设计网页的样式，美化网页；它不仅可以静态地修饰网页，还可以配合各种脚本语言动态地对网页各元素进行格式化；比如一开始文字显示是红色，我点击某个按钮后文字变黑色了。
2）你可以轻松地控制页面的布局，CSS 能够对网页中元素位置的排版进行像素级精确控制，因此我们能看到各式各样的布局风格。
3）在页面制作时采用CSS技术，可以有效地对页面的布局、字体、颜色、背景和其它效果实现更加精确的控制；例如通过文本属性，可以改变文本的颜色、字符间距，对齐文本，装饰文本，对文本进行缩进等等。
4）你可以将许多网页的风格格式同时更新，不用再一页一页地更新了；你可以将站点上所有的网页风格都使用一个CSS文件进行控制，只要修改这个CSS文件中相应的行，那么整个站点的所有页面都会随之发生变动。
5）CSS在几乎所有的浏览器上都可以使用。
CSS代码示例
JS能够让HTML结构这个人“跳舞”、“跑步”等动作，主要目的是让“人”动起来。
JS（JavaScript）是一种属于网络的高级脚本语言，已经被广泛用于Web应用开发，常用来为网页添加各式各样的动态功能，为用户提供更流畅美观的浏览效果；通常JavaScript脚本是通过嵌入在HTML中来实现自身的功能的。
js可以做什么：
JS代码示例
前端三大件到此介绍完毕，不过现在有些其他语言的程序猿在讨论HTML、CSS、JS倒是算不算编程语言。
前端开发工程师在精进一步可以发展为全栈工程师，向T型人才或者π型人才发展。
全栈工程师熟悉多种开发语言，同时具备前端和后台开发能力，既能做前端（需要熟悉前端三大件以及Vue等各种前端技术），又能做后端（需要熟悉Node.js或Java或ASP.net或php或Go等），可以独自完成一个产品的前、后台开发工作。
简单了解下全栈工程师的技术栈有哪些：
我们可以看到，对于全栈工程师来说，要活到老，学到老，其中最重要的属性，就是不同的思维方式和强大的学习能力。
最后，请重新认识一下你身边那个平平无奇的前端小伙伴吧！也可以把本篇文章分享给他看看，到底有几分像，哈哈。
作者：道三，电商PM；公众号: 产品大秘籍
本文由 @道三 原创发布于人人都是产品经理，未经作者许可，禁止转载。
题图来自Unsplash，基于CC0协议。
s 获取页面中的script标签，这是网上的一段代码，经测试，可以获取。
var child=document.children;
var arr=[];//用来存放获取到的所有的标签
function fn(obj) {
for (var i=0; i < obj.length; i++) {
if (obj[i].children) {//当当前元素还存在子元素的时候,递归
fn(obj[i].children);
}
arr.push(obj[i]); //遍历到的元素添加到arr这个数组中间
}
}
fn(child);
console.log(arr);//打印出最后获取到的结果
for (var i=(arr.length - 1); i >=0; i--) {
console.log(arr[i]);
}
其实，这段JavaScript代码的主要目的是获取当前页面中的所有DOM元素，包括script标签，并将它们存储在一个数组中。然而，它实际上并没有针对script标签进行特殊处理，而是获取了document.children的所有直接子元素及其子孙元素。
如果要专门获取页面中的所有script标签，我们可以稍微修改一下这段代码：
var arr=[];
function collectScripts(obj) {
for (var i=0; i < obj.length; i++) {
if (obj[i].nodeName==='SCRIPT') { // 当前元素为script标签时
arr.push(obj[i]);
}
if (obj[i].children && obj[i].children.length > 0) {
collectScripts(obj[i].children); // 如果当前元素还存在子元素，则递归查找
}
}
}
// 遍历整个文档对象模型以查找script标签
collectScripts(document.getElementsByTagName('html')[0].children);
console.log(arr); // 打印出所有找到的script标签
for (var i=(arr.length - 1); i >=0; i--) {
console.log(arr[i]);
}
看结果：
这里，我们首先通过document.getElementsByTagName('html')[0].children来获取HTML文档的顶层子元素，然后在遍历过程中检查每个元素是否是script标签，如果是则将其添加到数组arr中。同时保留了原有的递归结构，以便能够捕获嵌套在其他标签内的script标签。非常完美的实现了获取页面中的script标签。你也可以复制到浏览器的控制台试试。非常好用！
*请认真填写需求信息，我们会在24小时内与您取得联系。
