javascript - 把ID名作为参数传到函数里，使用不了？-PHP中文网问答

微信公众号讲师中心

首页

文章

后端开发 web前端数据库开发工具 php框架常见问题科技 Java 系统教程电脑教程硬件教程手机教程软件教程游戏教程自媒体新闻

专题

后端开发 web前端数据库开发工具 php框架科技 Java 系统教程电脑教程硬件教程手机教程软件教程游戏教程新闻

AI工具

AI 聊天问答 Agent智能体 AI 文本写作 AI 绘画作图 AI 设计工具 AI 视频创作 AI 音频制作 AI 办公学习 AI 编程开发 Prompt指令

学习

大前端后端开发数据库移动端运维开发计算机基础

编程手册

大前端后端开发数据库移动端运维开发计算机基础

下载

js特效网站源码工具下载类库下载网站素材学习资源插件扩展手机/移动开发手机游戏

最近更新

搜索

后端开发 web前端数据库开发工具 php框架常见问题科技 Java 系统教程电脑教程硬件教程手机教程软件教程游戏教程

javascript - 把ID名作为参数传到函数里，使用不了？

阿神 2017-04-11 12:00:37

[JavaScript讨论组]

395



 
  
  
  
  
  
  定时器-移动

阿神

闭关修行中......

全部回复(10)

巴扎黑2017-04-11 12:02:37 10楼

var x = 'p'; // 注意字符串要加引号
var obj = document.getElementById(x); // 这边是x已经是变量，所以就不用再加引号了哦
console.log(obj);

赞 +0

添加回复

天蓬老师2017-04-11 12:02:37 9楼

看了好几遍确定是双引号不是俩单引号，我还以为我眼花了……

<html>
<body>
  <p id="p"></p>
</body>

<script>
//设定一个变量x代替ID名为p的元素；
    var x=p;
    var obj=document.getElementById(""+ x +""); //这么一看挺萌的
    console.log(obj);
</script>
</html>

赞 +0

添加回复

阿神2017-04-11 12:02:37 8楼

var x='p';
var obj=document.getElementById(x);
console.log(obj);

赞 +0

添加回复

迷茫2017-04-11 12:02:37 7楼

· "p" .没有id是‘“p”’的

赞 +0

添加回复

天蓬老师2017-04-11 12:02:37 6楼

var obj=document.getElementById(id);

obj是一个DOM对象，不是jQuery对象，没有css("left", a)，应该obj = $('#'+id)

赞 +0

添加回复

高洛峰2017-04-11 12:02:37 5楼

修改成这样就可以了

<script>
var a=0;
function move(obj,time){
    var t=setInterval(function(){
       a=a+1;
        if(a<=200 && a>=0){
            obj.css("left",a);
        }
        else{
            clearInterval(t);
        }
    },time)
}
move($("#p"),10);
move($("#p2"),500);

</script>

赞 +0

添加回复

迷茫2017-04-11 12:02:37 4楼

你直接传id名就是对象了，不用再加引号，也不用再getElementById了,你在move函数里面console.log(idName)出来的就是；另外obj是原生DOM对象,需要加上$，即调用css方法时将obj改成$(obj)

所以你的代码需要改两处，最终如下，应该是你要的结果：

var a=0;
function move(idName,time){
    
    var obj=idName;//直接传给obj
    var t=setInterval(function(){
       a=a+1;
        if(a<=200 && a>=0){
            $(obj).css("left",a);//使用$(obj)调用css方法
        }
        else{
            clearInterval(t);
        }
    },time)
}

move(p,1000);

赞 +0

添加回复

巴扎黑2017-04-11 12:02:37 3楼

move(p, 1000)？ p都没有定义吧好像。不应该是move('p', 1000)吗？

直接使用jquery的话，在move函数里边可以直接var obj = $('#' + idName);就O了。

不使用jquery的话也是可以的：var obj = document.getElementById(idName);
改变left值使用：obj.style.left = a + 'px';就可以了。

赞 +0

添加回复

ringa_lee2017-04-11 12:02:37 2楼

你的想法是传入一个id，可是你传入的是一个未申明的变量
正确的做法是

move("p",1000)

或者

var nodeID = "p"
move(nodeID,1000)

另外你想打印：的话
应该是

console.log(obj)

赞 +0

添加回复

黄舟2017-04-11 12:02:37 1楼

<!doctype html>
<html lang="en">
 <head>
  <meta charset="UTF-8">
  <meta name="Generator" content="EditPlus®">
  <meta name="Author" content="">
  <meta name="Keywords" content="">
  <meta name="Description" content="">
  <title>定时器-移动</title>
  <script type="text/javascript" src="jquery-1.10.1.min.js"></script>
 </head>

<style>
 #p{width:100px;height:100px;background:red;position:absolute; top:100px;}
 
</style>
 <body>
  <p id="p"></p>
<script>
var a=0;
function move(idName,time){
    var id='"'+idName+'"';
//下行打印的id值为"[object HTMLpElement]"，但是我实际想要的效果是<p id="p"></p>；
    console.log(id);
    var obj=document.getElementById(id);
    var t=setInterval(function(){
       a=a+1;
        if(a<=200 && a>=0){
            obj.css("left",a);
        }
        else{
            clearInterval(t);
        }
    },time)
}

move(p,1000);

</script>


 </body>
</html>

1.p变量对应为id属性值为p的HTML元素，如果你的把改成或 看看效果
这是浏览器的行为，是一个很不好的行为，会引起代码混乱～～～
2.在浏览器行为下，传递了一个HTML元素给move函数,var id='"'+idName+'"';执行字符串拼接，HTML转成字符串[object HTMLpElement]``

解决方法:
定义一个变量其值为对应的id值,消除变量歧义

var pIdName="p";
move(pIdName,1000);

赞 +0

添加回复

专题推荐

更多>

热门话题

热门教程

更多>