Question

在下面的代码块中，我尝试在页面加载时动态更新data-url属性：

<div id="linkedIn">
        <script src="//platform.linkedin.com/in.js" type="text/javascript">
          lang: en_US
        </script>
        <script type="IN/Share" data-url=""></script>
</div>

我的JS：

var url = window.location.href; 
$('script[type="IN/Share"]').attr("data-url",url);

在一些搜索后我已经尝试使用数据而不是attr，问题仍未解决。它不断返回“未定义”。谢谢你的帮助

Answer 1

你应该意识到：

呈现页面的源代码不受您的javascript
但DOM状态是（当您检查元素时，您会看到更改）。
并且当您确定文档已完全加载时，您通常希望执行这些操作（或至少执行以下逻辑操作）。用$（document）.ready（function（）{}）;

Answer 2

您遇到的问题是包含的脚本会更改用于选择元素的type属性。它将其更改为type="IN/Share+init"，因此要么向脚本元素添加id并根据它进行选择，建议使用，要么使用更改后的值来设置data-url属性，这是一个工作小提琴

http://jsfiddle.net/yscz77g3/2/

var url = window.location.href;
var $el =  $("#test"); // recommended
   // $('script[type="IN/Share+init"]'); // or uncomment and target the changed type

$el.attr("data-url",url);
alert($el.attr("data-url"));

HTML

<div id="linkedIn">

        <script src="//platform.linkedin.com/in.js" type="text/javascript">
          lang: en_US
        </script>

        <script id="test" type="IN/Share" src="//platform.linkedin.com/in.js">
        </script>
</div>

在JQuery中更新脚本标记属性

2 个答案: