javascript - 是否可以在文档准备好之前进行一些客户端 DOM 操作?

标签 javascript jquery dom googlebot google-rich-snippets

我正在尝试找到一种方法(如果可能)使用 javascript 在渲染时和 DOM 完全加载之前向元素添加一些属性。我知道,这听起来适得其反,但让我给你一些背景知识:

  • 我在一个极其有限的模板平台上工作,该平台允许我访问一些页面变量,但它们需要一些小的字符串操作。我无法利用任何 ASP 预处理,因此必须在客户端进行。
  • 具体来说,我试图在 Googlebot 扫描文档内容之前向元素添加 Schema.org 微数据标记。
  • 基本上我需要修改 $5.99 中的一个属性值至 5.99 .

这是我最近的一次尝试,它正确地进行了 DOM 修改,但不是在 Google 的丰富代码段验证器处理页面之前:

<div class="pitinfo"><div class="padleft padright"><%Product.BasePrice%></div></div>

<!-- at page bottom -->
<script type="text/javascript">
    (function() {
        var pricesting = "<%Product.BasePrice%>";
        var price =  pricesting.slice(1);
        $('.pitinfo').attr('itemprop', 'price');
        $('.pitinfo').attr('content', price);
    })();
</script>

加载后我得到这个 <div class="pitinfo" itemprop="price" content="9.99">$9.99</div> ,但是丰富的代码段测试工具告诉我 price未设置。

我已经尝试在我的模板代码中使用 ASP,但托管服务提供商不允许。

是否可以在文档呈现流程的中间某个时间进行 DOM 修改?

最佳答案

可以插入 <script> <body> 内的标签.标记内的 JavaScript 在 HTML 之前加载,因此您可以在加载其余 HTML/JS 之前编辑元素的值。
例如:

<div>
    <div id="element" value="$5.99"></div>
    <script>
        var element = document.getElementById("element")
        element.value = 5.99;
    </script>
</div>

可以看看here

关于javascript - 是否可以在文档准备好之前进行一些客户端 DOM 操作?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/55427064/

相关文章:

javascript - 使用 jQuery 动态设置元素的高度并在窗口调整大小时更改高度

javascript - 浏览器中的半像素如何与 JavaScript clientWidth/clientHeight 关联?

javascript - AngularJS - 从页面底部的远程服务器加载更多数据

javascript - 覆盖数据集函数

javascript - HTML 修改 JavaScript 代码表示我的 HTML 元素未定义

javascript - 突出显示 HTML 表格中的所有数据

javascript - jQuery 选择值失败

JavaScript 与 html anchor 冲突

javascript - 使用 JavaScript 刷新内部页面

jQuery DataTables 隐藏列而不将其从 DOM 中删除