2015.11.29 PM 5:47 修改更新
添加一段代码，改成用js规定#line2的css，最后直接onclick调用positionLine2()，就可以运行了。
但是我注释掉js中规定#line2的css的部分，然后再html中用css直接定义，就不行了
像下面这样：
6
789p#line2 {
color: #66ceff;
position: absolute;
top: 350px;
left: 140px;
font-size: 90px;
}
<script>
.....
function positionLine2() {
if (!document.getElementById) return false;
if (!document.getElementById("line2")) return false;
/*
var elem = document.getElementById("line2");
elem.style.color = "#66ceff";
elem.style.position = "absolute";
elem.style.left = "140px";
elem.style.top = "350px";
elem.style.fontSize = "90px"
*/
moveAE("line2", 290, 150, 5)
}
.....
var bott = document.getElementById("botton")
bott.addEventListener("click", function() {
positionLine2()
})
</script>2015.11.29 PM 4:41 修改更新
谢谢各位的帮助~~新手捂脸感谢
代码根据各位前辈的指点改过一遍了，修改部分在上面备注指出，但是还是不行，这些代码的主要功能就是两行文字在点击按钮之后移动，但就是实现不了，继续求挑问题。
另外，还有一点别的疑惑，为什么repeat要这样用字符串的方式写
var repeat = "moveAE('" + elementid + "'," + xfi + "," + yfi + "," + intime + ")"而不能直接向下面这样呢？
var repeat = moveAE(elementid, xfi, yfi, intime)原始代码：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>hey</title>
</head>
<style type="text/css">
p#line1 {
color: transparent;
-webkit-text-stroke: 1px #66ceff;
position: absolute;
top: 350px;
left: 140px;
font-size: 90px;
}
p#line2 {
color: #66ceff;
position: absolute;
top: 350px;
left: 140px;
font-size: 90px;
}
#botton {
background-color:transparent;
border: 1px #66ceff solid;
position: absolute;
top: 250px;
left: 520px;
font-size: 30px;
color:#66ceff;
width:150px;
height:46px;
line-height:40px;
text-align:center;
}
/*#botton :hover{ 错误*/
#botton :hover{
background-color:#66ceff;
color:#ffffff;
}
</style>
<body>
<p id="line1">Hello,John.</p>
<p id="line2">削了个椰子，你却给个梨</p>
<p id="botton">
move
</p>
</body>
<script type="text/javascript">
/*function moveAE("elementid", xfi, yfi, intime) { 错误*/
function moveAE(elementid, xfi, yfi, intime) {
if (!document.getElementById(elementid)) return false
var elem = document.getElementById(elementid)
var xnow = parseInt(elem.style.left)
var ynow = parseInt(elem.style.top)
/*if (xnow = xfi && ynow = yfi) return false 错误*/
if (xnow == xfi && ynow == yfi) return false
if (xnow < xfi) {
xnow++
}
if (xnow > xfi) {
xnow--
}
if (ynow < yfi) {
ynow++
}
if (ynow > yfi) {
ynow--
}
elem.style.left = xnow + "px"
elem.style.top = ynow + "px"
var repeat = "moveAE('" + elementid + "'," + xfi + "," + yfi + "," + intime + ")"
movement = setTimeout(repeat, intime)
}
/* 改为用js给按钮绑定事件 */
var bott = document.getElementById("botton")
bott.addEventListener("click", function() {
moveAE('line1', 350, 250, 10)
moveAE('line2', 350, 350, 10)
})
</script>
</html>各种失效，代码是照着《javascript DOM编程艺术》写的，查了一遍感觉没错，有大神能看出来问题吗
收藏
1) 基本上每个JS语句后的；都缺失
2) moveAE在事件回调中为什么调用2次，目的是什么？
3) 通过
getComputedStyle来获取通过CSS添加的样式最终值4)
parseInt(elm.style.left)可能获取结果NaN，所以要parseInt(elm.style.left)||0来保护操作5)setTimeout/setInterval要避免出入字符串形式的函数，因其最终是通过eval函数调用，而eval函数是不推荐使用的
js代码里的函数声明应该放在你button按钮绑定这个函数之前吧，你绑定函数的时候，这个函数都不存在，自然没有效果。
比较好的做法是，在js函数声明之后，用js给按钮绑定onclick事件
moveae第一个参数什么鬼啊？语法都不对
html页面内嵌的script标签一般放在</body>之前，虽然js语法讲语句尾加不加分号都可以但是如果以后准备正经写这个还是加上吧，楼上说的第一个参数的问题，赋值操作符什么的明显是基础不牢啊少年，另外你把你想要干什么说清楚大家才好对症下药啊
首先
"line1"这里用单引号，即：'line1'然后
//这里失效这一行去掉，或者换成/*这里失效*/*css里面没有
//的注释最后
#botton :hover中间不能有空格
button:hover