交作业，哈哈哈哈。这次就图片吧
不知道为什么会报错，一模一样的代码{:10_245:}
醉梦醒 发表于 2017-4-9 13:43
不知道为什么会报错，一模一样的代码
可能是编译器，编译模式还是html
只要最后点击".html"文件能运行就行
不二如是 发表于 2017-4-9 14:13
可能是编译器，编译模式还是html
只要最后点击".html"文件能运行就行
找到原因了，是我html文件中的<a>标签的id属性这一段代码掉了{:10_278:}
那我改先学html5还是css还是js啊{:10_243:}
交作业<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>链接CSS样式表</title>
<link rel="stylesheet" href="0007CSS.css">
</head>
<body>
<div id="container">
<h1>我爱鱼C</h1>
<p>让编程改变世界!<br/>Change the world by program!</p>
<a href="http://www.fishc.com/" id="first_Js">传送门</a>
<a href="http://bbs.fishc.com/forum.php?mod=collection&action=view&ctid=539" id="first_Js2">HTML5-庖丁解牛</a>
</div>
<!--JS代码放在<body>,这样避免JS代码提前被解析，提高加载速度。-->
<script src="0008JS.js"></script>
<!--方式二
<script>
var firstJs= document.getElementById("first_Js");/*getElementById:返回对拥有指定 id 的第一个对象的引用。*/
var firstJs2=document.getElementById("first_Js2");
// alert(firstJs);
firstJs.onclick = function(e)
{
e.preventDefault();/*preventDefault:取消事件的默认动作。*/
firstJs.innerHTML = "穿越成功";
firstJs2.innerHTML="HTML5-庖丁解牛";
};
firstJs2.onclick=function (e) {
e.preventDefault();
firstJs.innerHTML="传送门";
firstJs2.innerHTML = "穿越成功";
};
</script>
-->
</body>
</html>
我有两个不太清楚的地方，如果将JavaScript代码放在head的里，JavaScript代码就没有效果了，我想是不是浏览器加载html文件时先加载的body部分；
还有如果JavaScript代码放在a标签上面的话也没有效果，是不是因为html的代码是一行行读取的，加载JavaScript代码时之前没加载a标签，就找不到a标签了，所以JavaScript代码就无效了
18813034116 发表于 2017-5-19 20:45
我有两个不太清楚的地方，如果将JavaScript代码放在head的里，JavaScript代码就没有效果了，我想是不是浏览 ...
如果Js代码，用<script>包起来，放在head中也是可以的，只是这样不符合“顺序执行”的潜规则
这也是Js广受诟病的”弱类型“众多坑之一
推荐阅读：0 1 3 0 ★ "你妹"版Js顺序机制
代码基本一致。却没效果显示{:10_266:} 肿么回事？
帮我看看{:10_254:}
xxxx.html:
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>欢迎来到HTML世界</title>
<link href="0008.css" rel="stylesheet">
</head>
<body>
<div id="container">
<h1>我爱鱼C</h1>
<p>www.Fish.com - 让编程改变世界</p>
<a href="http://bbs.fishc.com/forum-337-1.html" id="first_Js">传送门</a>
</div>
<script src="first_Js.js"></script>
</body>
</html> xxxx.css:
/*用来制定样式文件的编码格式*/
@charset "UTF-8";
html,body{
height: 100%;
color: #0000ff;
font-family: 思源宋体；
}
body{
background: url(background.jpg) center center;
background-size: cover;
margin: 0; /*养成初始化好习惯*/
padding: 0;
position: relative;
}
#container{
width: 100%;
text-align: center;
position: absolute;
top: 50%;
transform: translateY(-50%); /*不同浏览器的transform,是不一样的，-ms-、 -moz-、后续详细介绍*/
}
h1{
font-size: 33px;
margin-bottom: 22px;
}
p{
font-size: 22px;
margin-bottom: 22px;
}
a{
text-decoration: none;
padding: 8px 44px;
background: #7700ff;
color: #fff;
border: 1px solid #7700ff;
border-radius: 3px;
font-size: 18px;
}first.Js.js:
var first_Js = document.getElementById("first_Js");
first_Js.onclick = function(e)
{
e.preventDefault();
first_Js.innerHTML = "穿越成功"；
}
lumber2388779 发表于 2017-3-24 16:50
发现问题，你的教程中的第二段代码发布没编辑好，导致部分代码不是在代码段里面
哪儿部分需要改代码吗？我的没效果
本帖最后由 lumber2388779 于 2017-6-14 16:55 编辑
你发帖问下不二兄吧，我看到是css名称跟你文件名不一样
问一下，这个位置哪里错了？JS文件完全显示不出来。
然后4 跟 6行显示是红色？是哪里输入出了问题么？
继续学习
里面提到的Alert应该怎么用呢
chrome支持js吧,你发的代码和我抄出来的代码都没有"穿越成功"这个效果……
我用这个alert收到的信息是……
本帖最后由 gentes 于 2017-12-7 15:55 编辑
无法正常js跳转。
JS部分不正常跳转
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>欢迎来到HTML世界</title>
<link href="css/index.css" rel="stylesheet">
</head>
<body>
<div id="container">
<h1>我爱鱼C</h1>
<p>WWW.FihsC.com - 让编程改变世界</p>
<a href="http://bbs.fishc.com/forum-337-1.html" id="first_Js">传送门</a>
</div>
<script type="text/javascript">
var first_Js = document.getElemetById("first_Js");
/*alert(first_Js);*/
first_js.onclick=function(e){
e.prevenDefault();
first_Js.innerHTML="穿越成功";
}
</script>
</body>
</html>
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>易改乌江水鱼C学习</title>
<link href="yucxue.css" rel="stylesheet">
</head>
<body>
<div id="ha">
<h1>易改乌江水爱鱼C</h1>
<p>WWW.FishC.com</p>
<a href="http://bbs.fishc.com/thread-81259-1-1.html" id="pao_js">HTML5-庖丁解牛-0009</a>
<a href="http://bbs.fishc.com" id="bbs_js">
<img src="fishc.png" width="359" height="84" />
</a>
</div>
<script src="yucxue.js"></script>
</body>
</html>
var pao_js = document.getElementById("pao_js");
pao_js.onclick = function(e)
{
e.preventDefault();
pao_js.innerHTML="传送成功"
}
@charset "UTF-8";
html{
height: 100%;
color: #5599FF;
font-family: sans-serif;
}
body{
background: url(background.jpg);
background-size: cover;
background: url(background.jpg) center center;
}
#ha
{
width: 100%;
text-align: center;
}
h1
{
font-size: 66px;
margin-bottom: 22px;
}
a
{
font-size: 20px;
background: #FFDD55;
padding:9px 22px;
text-decoration: none;
color: #FFF;
border:3px solid #FFDD55;
border-radius: 3px;
margin: 5px 33px 5px 33px;
二，innerHTML属性来修改，单击“传送门”后字体变为“穿越成功” first_Js.onclick = function(e)
{
e.preventDefault();
first_Js.innerHTML = "穿越成功";
}
楼主大人，上面那个代码应该放到哪个位置？