Php Javascript没有启动另一个函数

我正在尝试使用javascript向html文件添加新元素（按钮）。以下是工作脚本：

var元素=document.createElement（“输入”）；
element.type=“按钮”；
element.value=“单击我”；
element.id=；
var foo=document.getElementById（“示例”）；
foo.appendChild（元素）；

脚本将新元素添加到html文件中，但我也想更改一些属性（例如：按钮大小）

我有方法SetProperties（id，fontSize），如果我在应该创建元素时在代码中添加它，它将不起作用，它甚至不会创建新元素。下面是让我头疼的代码：

<div id="examples">
    <?php
    while ($row=mysql_fetch_array($result))
    {?>
    <script type="text/javascript">
        var element = document.createElement("input");
        element.type = "button";
        element.value = "Click me";
        element.id = <?=$row['id'];?>;

        var foo = document.getElementById("examples");
        foo.appendChild(element);

        *SetProperties(<?=$row['id'];?>, <?=$row['fontSize'];?>);*
    </script>

    <?php
    }
    ?>
</div>

var元素=document.createElement（“输入”）；
element.type=“按钮”；
element.value=“单击我”；
element.id=；
var foo=document.getElementById（“示例”）；
foo.appendChild（元素）；
*SetProperties（，）*

下面是更改新元素属性的函数：

<script type="text/javascript">
function SetProperties(id, fontSize)
{
    var btn = document.getElementById(id);
    btn.style.fontSize = fontSize + "px;";
}
</script>

函数集属性（id、fontSize）
{
var btn=document.getElementById（id）；
btn.style.fontSize=fontSize+“px；”；
}

您可以这样尝试

<style>
#examples [type=button]
{
    font-size:25px;
}
</style>

<div id="examples">
    <?php
    while ($row=mysql_fetch_array($result))
    {?>
    <script type="text/javascript">
        var element = document.createElement("input");
        element.type = "button";
        element.value = "Click me";
        element.id = <?=$row['id'];?>;

        var foo = document.getElementById("examples");
        foo.appendChild(element);

    </script>

    <?php
    }
    ?>
</div>

#示例[类型=按钮]
{
字体大小：25px；
}
var元素=document.createElement（“输入”）；
element.type=“按钮”；
element.value=“单击我”；
element.id=；
var foo=document.getElementById（“示例”）；
foo.appendChild（元素）；

关于您的代码，请尝试仅使用字符串作为id：

 element.id = "<?=$row['id'];?>";

 /* ... */

 SetProperties("<?=$row['id'];?>");

然后在CSS中：

.do-something { /* set CSS properties */ }

另外，如果您需要添加一个单击处理程序，并且有很多按钮，那么可以将该处理程序分配给按钮容器（示例使用jQuery）：

这比为每个按钮分配单击处理程序更有效。

<script type="text/javascript">
function SetProperties(id)
{
    document.getElementById(id).style.fontSize = 25 + "px";
}
</script>

<div id="examples">
    <?php
    while ($row=mysql_fetch_array($result))
    {?>
    <script type="text/javascript">
        var element = document.createElement("input");
        element.type = "button";
        element.value = "Click me";
        element.id = <?=$row['id'];?>;

        var foo = document.getElementById("examples");
        foo.appendChild(element);

        SetProperties(<?=$row['id'];?>, <?=$row['fontSize'];?>);
    </script>

    <?php
    }
    ?>
</div>

函数集属性（id）
{
document.getElementById（id）.style.fontSize=25+“px”；
}
var元素=document.createElement（“输入”）；
element.type=“按钮”；
element.value=“单击我”；
element.id=；
var foo=document.getElementById（“示例”）；
foo.appendChild（元素）；
SetProperties（，）；

我同意@meagar——既然可以在服务器上完成所有工作，为什么还要发出JavaScript

下面是如何直接在服务器端添加元素，而不是发出JavaScript，然后在客户端添加元素：

<div id="examples">
    <?php
    while ($row=mysql_fetch_array($result))
    {?>
        <input type="button" value="Click me" id="<?=$row['id'];?>" />
    <?php } ?>
</div>

您可以这样做，以避免在“客户端”创建“按钮”
尝试使用
echo
功能。。。PHP的一些实现不喜欢
为什么？为什么要通过输出修改DOM的JavaScript来实现这一点？你为什么不直接输出HTML呢？@Brian如果我把
改成echo，他会看到一些非常明显的问题，但是如果我也想改变属性，它就不起作用了。谢谢您的建议。@donkeydown，
我已经写了一个固定的示例，但是在我的应用程序中，我从数据库中获取了这个值，所以我不能像您的示例那样编写这样的规则。您可以在这里添加该块的标识符，它是id=“examples”，您可以根据需要在循环之前添加为div。。
 $('#examples').on('click', '.do-something', function () { /* handler */ });

<script type="text/javascript">
function SetProperties(id)
{
    document.getElementById(id).style.fontSize = 25 + "px";
}
</script>

<div id="examples">
    <?php
    while ($row=mysql_fetch_array($result))
    {?>
    <script type="text/javascript">
        var element = document.createElement("input");
        element.type = "button";
        element.value = "Click me";
        element.id = <?=$row['id'];?>;

        var foo = document.getElementById("examples");
        foo.appendChild(element);

        SetProperties(<?=$row['id'];?>, <?=$row['fontSize'];?>);
    </script>

    <?php
    }
    ?>
</div>

<div id="examples">
    <?php
    while ($row=mysql_fetch_array($result))
    {?>
        <input type="button" value="Click me" id="<?=$row['id'];?>" />
    <?php } ?>
</div>

<style>
    #examples input {
        font-size: 25px;
    }
</style>

You may try like this to avoid creating `buttons` at `client` side

<div id="examples">
        <?php
        while ($row=mysql_fetch_array($result))
        {?>
            <input type="button" value="Click me" id="<?=$row['id'];?>" style="font-size: 25px;" />
        <?php } ?>
    </div>